/*
 * Black Ember site layer: header layout and states, the Menu Cart off-canvas, wishlist drawer,
 * quick view dialog and toast. Ported from the reference (.hdr2 v11/v22/v24, .drawer, .modal,
 * .toast). Colours read the child-theme tokens, which follow Elementor's Global Colors; widget
 * Style controls override them per instance.
 */

html.be-locked { overflow: hidden; }

.be-sr {
	position: absolute;
	width: 1px;
	height: 1px;
	overflow: hidden;
	clip: rect(0 0 0 0);
	white-space: nowrap;
}

/* ------------------------------------------------------------------ header */
/* Root container: Advanced → Black Ember header → "This is the site header" (class be-hdr-yes). */
.be-hdr-yes {
	--hdr: 84px;
	position: relative;
	z-index: 9000;
	transition: box-shadow .3s, background-color .5s;
}

.be-hdr-yes.be-hdr-sticky-yes {
	position: sticky;
	top: env(safe-area-inset-top, 0px);
}

.admin-bar .be-hdr-yes.be-hdr-sticky-yes { top: calc(32px + env(safe-area-inset-top, 0px)); }

/* Elementor wraps the Header template in <header class="elementor-location-header">, which is only as tall as
   the header itself, so a sticky header inside it would scroll away. Let the header stick to the page instead. */
.elementor-location-header:has(> .be-hdr-yes.be-hdr-sticky-yes) { display: contents; }

.be-hdr-yes.be-scrolled.be-hdr-shadow-yes { box-shadow: 0 12px 34px rgba(0, 0, 0, .35); }

/* On the front page the header floats over the hero and turns solid once scrolled (v11). */
body.home .be-hdr-yes.be-hdr-over-yes {
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	background: transparent !important;
	background-image: none !important;
	border-bottom-color: transparent !important;
}

.admin-bar.home .be-hdr-yes.be-hdr-over-yes { top: 32px; }

/* The blur sits on a pseudo-layer: a backdrop-filter on the header itself would trap the
   fixed-position cart and wishlist drawers inside it. */
body.home .be-hdr-yes.be-hdr-over-yes::before {
	content: "" !important;
	position: absolute;
	inset: 0;
	z-index: -1;
	background: var(--be-hdr-scrolled-bg, rgba(26, 6, 5, .82)) !important;
	-webkit-backdrop-filter: blur(14px);
	backdrop-filter: blur(14px);
	opacity: 0 !important;
	transition: opacity .5s;
	pointer-events: none;
}

body.home .be-hdr-yes.be-hdr-over-yes.be-scrolled::before { opacity: 1 !important; }

/* Demo notice bar: the first row inside the header (Header template → container "be-demo-bar"). It spans
   the full width, and the page-wide --hdr (sticky offsets, anchors, hero) grows by its height, which
   site.js keeps exact in --be-bar-h; these are the defaults before that runs. */
.be-hdr-yes > .be-demo-bar { margin-inline: calc(-1 * var(--gl, 32px)) calc(-1 * var(--gr, 32px)); width: auto; }
.be-demo-bar .elementor-widget-container { text-align: center; }
.be-demo-bar a { color: inherit; text-decoration: underline; text-underline-offset: 2px; }
body:has(.be-demo-bar) { --be-bar-h: 38px; }
@media (max-width: 760px) { body:has(.be-demo-bar) { --be-bar-h: 36px; } }

/* Gutters on any container: add the class be-pad (follows the reference 32px / 18px). */
.e-con.be-pad { --padding-left: var(--gl, 32px); --padding-right: var(--gr, 32px); }

.be-hdr-yes .be-hdr-in { max-width: 1640px; margin-inline: auto; }

/* Inner row: logo · menu · icons. Two rows (logo + icons, then a scrolling menu) at 1260px and below. */
.be-hdr-yes .be-hdr-in {
	display: grid !important;
	grid-template-columns: auto minmax(0, 1fr) auto;
	align-items: center;
	gap: 24px;
	height: var(--hdr);
}

.be-hdr-yes .be-hdr-in > .be-logo { grid-column: 1; }
.be-hdr-yes .be-hdr-in > .be-nav { grid-column: 2; justify-self: center; min-width: 0; }
.be-hdr-yes .be-hdr-in > .be-icons { grid-column: 3; }

@media (max-width: 1260px) {
	.be-hdr-yes .be-hdr-in {
		height: auto;
		grid-template-columns: minmax(0, 1fr) auto;
		grid-template-rows: 64px auto;
		grid-template-areas: "logo icons" "nav nav";
		column-gap: 12px;
		row-gap: 0;
	}
	.be-hdr-yes .be-hdr-in > .be-logo { grid-area: logo; }
	.be-hdr-yes .be-hdr-in > .be-icons { grid-area: icons; }
	.be-hdr-yes .be-hdr-in > .be-nav { grid-area: nav; justify-self: center; width: auto; max-width: 100%; margin-bottom: 6px; }
}

@media (max-width: 760px) {
	.be-hdr-yes .be-hdr-in > .be-nav { justify-self: stretch; }
}

@media (max-width: 560px) {
	.be-hdr-yes .be-hdr-in { gap: 10px; }
}

/* Logo: mark + wordmark (v22). */
.be-logo {
	display: flex !important;
	flex-direction: row !important;
	flex-wrap: nowrap !important;
	align-items: center;
	gap: 12px;
	min-width: 0;
}

.be-logo .be-mark img,
.be-logo .be-mark svg {
	display: block;
	height: auto;
	filter: drop-shadow(0 0 6px rgba(240, 106, 42, .35));
}

.be-logo .be-words { gap: 6px !important; min-width: 0; flex-wrap: nowrap !important; }
.be-logo > .elementor-element,
.be-icons > .elementor-element { flex: 0 0 auto; width: auto; }
.be-logo .elementor-heading-title { line-height: 1; white-space: nowrap; }

@media (max-width: 560px) {
	.be-hdr-yes .be-logo .be-words { gap: 5px !important; }
}

@media (max-width: 380px) {
	.be-hdr-yes .be-logo .be-mark { display: none; }
}

/* Main menu (Nav Menu widget with class be-nav): uppercase links, amber underline (v24). */
.be-nav .elementor-nav-menu--main .elementor-nav-menu { gap: clamp(6px, 1.2vw, 18px); flex-wrap: nowrap; }
.be-nav .elementor-nav-menu--main .elementor-nav-menu::after { display: none; }

.be-nav .elementor-nav-menu--main .elementor-item {
	position: relative;
	min-height: 36px;
	padding: 0 17px !important;
	white-space: nowrap;
	transition: color .3s;
}

.be-nav .elementor-nav-menu--main .elementor-item::after {
	content: "";
	position: absolute;
	left: 17px;
	right: 17px;
	bottom: 4px;
	height: 2px;
	background: var(--be-nav-line, #D7A15C);
	transform: scaleX(0);
	transform-origin: left;
	transition: transform .3s;
	opacity: 1 !important;
}

.be-nav .elementor-nav-menu--main .elementor-item:hover::after,
.be-nav .elementor-nav-menu--main .elementor-item:focus-visible::after,
.be-nav .elementor-nav-menu--main .elementor-item.elementor-item-active::after { transform: scaleX(1); }

@media (max-width: 1260px) {
	.be-nav .elementor-nav-menu--main {
		overflow-x: auto;
		scrollbar-width: none;
	}
	.be-nav .elementor-nav-menu--main::-webkit-scrollbar { display: none; }
}

@media (max-width: 760px) {
	.be-nav .elementor-nav-menu--main .elementor-nav-menu { justify-content: flex-start; }
	.be-nav .elementor-nav-menu--main .elementor-item { padding: 0 13px !important; }
	.be-nav .elementor-nav-menu--main .elementor-item::after { left: 13px; right: 13px; }
}

/* Round icon buttons (v11): search, account, wishlist, cart. */
.be-icons {
	display: flex !important;
	flex-direction: row !important;
	flex-wrap: nowrap !important;
	justify-content: flex-end;
	align-items: center;
	gap: 8px;
}

@media (max-width: 560px) {
	.be-icons .be-hide-s { display: none !important; }
}

.be-ibtn,
.be-icons .elementor-icon,
.be-icons .elementor-menu-cart__toggle .elementor-button {
	position: relative;
	width: 42px !important;
	height: 42px !important;
	padding: 0 !important;
	display: inline-flex !important;
	align-items: center;
	justify-content: center;
	border-radius: 50% !important;
	background: var(--be-ibtn-bg, rgba(255, 255, 255, .06)) !important;
	border: 1px solid var(--be-ibtn-border, rgba(255, 235, 225, .12)) !important;
	color: var(--be-ibtn-color, #EFE5D4) !important;
	-webkit-backdrop-filter: blur(10px);
	backdrop-filter: blur(10px);
	cursor: pointer;
	transition: color .2s, background .2s;
}

.be-ibtn:hover,
.be-ibtn[aria-expanded="true"],
.be-icons .elementor-icon:hover,
.be-icons .elementor-menu-cart__toggle .elementor-button:hover {
	background: var(--be-ibtn-hover-bg, rgba(255, 255, 255, .14)) !important;
	color: var(--be-ibtn-hover, #fff) !important;
}

.be-ibtn svg,
.be-icons .elementor-icon svg,
.be-icons .elementor-menu-cart__toggle .elementor-button-icon svg {
	width: 22px !important;
	height: 22px !important;
	fill: none;
	stroke: currentColor;
}

.be-icons .elementor-widget-woocommerce-menu-cart {
	--toggle-button-icon-color: var(--be-ibtn-color, #EFE5D4);
	--toggle-button-icon-hover-color: var(--be-ibtn-hover, #fff);
	--toggle-icon-size: 22px;
}

.be-icons .elementor-menu-cart__toggle .elementor-button-text { display: none; }
.be-icons .elementor-menu-cart__toggle .elementor-button-icon { position: static; }

.be-icons .be-cnt,
.be-icons .elementor-menu-cart__toggle .elementor-button-icon-qty {
	position: absolute !important;
	top: 2px !important;
	right: 1px !important;
	left: auto !important;
	min-width: 19px;
	height: 19px;
	padding: 0 5px;
	border-radius: 10px;
	background: var(--be-cnt-bg, #fff) !important;
	color: var(--be-cnt-color, #7A1410) !important;
	font-size: 11px;
	font-weight: 700;
	line-height: 1;
	display: flex;
	align-items: center;
	justify-content: center;
	transform: translate(35%, -35%);
}

.be-icons .be-cnt[hidden],
.be-icons .elementor-menu-cart__toggle .elementor-button-icon-qty[data-counter="0"] { display: none !important; }

@media (max-width: 560px) {
	.be-ibtn,
	.be-icons .elementor-icon,
	.be-icons .elementor-menu-cart__toggle .elementor-button { width: 42px !important; height: 42px !important; }
}

/* ------------------------------------------------------------------ shared buttons & type */
.be-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 10px;
	min-height: 52px;
	padding: 0 34px;
	background: var(--ink2, #16120E);
	color: var(--bone, #EFE5D4);
	border: 1.5px solid var(--ink2, #16120E);
	font-family: var(--f);
	font-size: 12px;
	font-weight: 600;
	letter-spacing: .18em;
	text-transform: uppercase;
	cursor: pointer;
	transition: background .2s, color .2s, border-color .2s;
}

.be-btn:hover,
.be-btn:focus-visible { background: var(--amber, #B97F35); border-color: var(--amber, #B97F35); color: #fff; }
.be-btn.out { background: transparent; color: var(--text, #16120E); }
.be-btn.out:hover { background: var(--ink2, #16120E); color: var(--bone, #EFE5D4); border-color: var(--ink2, #16120E); }
.be-btn[aria-busy="true"] { opacity: .6; pointer-events: none; }

.be-link {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	min-height: 40px;
	font-size: 11px;
	font-weight: 600;
	letter-spacing: .18em;
	text-transform: uppercase;
	color: var(--soft, #7A6D5E);
	transition: color .2s, gap .2s;
}

.be-link:hover { color: var(--text, #16120E); gap: 12px; }

.be-eyebrow {
	margin: 0;
	font-size: 11px;
	font-weight: 600;
	letter-spacing: .24em;
	text-transform: uppercase;
	color: var(--soft, #7A6D5E);
}

.be-muted { margin: 0; color: var(--muted, #5F5346); }

/* ------------------------------------------------------------------ scrim, drawers */
.be-scrim {
	position: fixed;
	inset: 0;
	z-index: 9980;
	background: rgba(11, 9, 8, .55);
}

.be-drawer {
	position: fixed;
	z-index: 9981;
	top: 0;
	right: 0;
	bottom: 0;
	width: min(440px, 100%);
	display: flex;
	flex-direction: column;
	padding: calc(20px + env(safe-area-inset-top, 0px)) max(24px, env(safe-area-inset-right, 0px)) calc(20px + env(safe-area-inset-bottom, 0px)) 24px;
	background: var(--be-drawer-bg, var(--paper, #F4EDE2));
	color: var(--text, #16120E);
	box-shadow: -20px 0 60px rgba(0, 0, 0, .2);
}

.be-dh {
	display: flex;
	justify-content: space-between;
	align-items: center;
	padding-bottom: 16px;
	border-bottom: 1px solid var(--line, #D8CCBB);
}

.be-dh h2 {
	margin: 0;
	font-size: 16px;
	font-weight: 600;
	letter-spacing: .08em;
	text-transform: uppercase;
}

.be-dclose {
	min-height: 40px;
	padding: 0;
	border: 0;
	background: none;
	color: inherit;
	font-family: var(--f);
	font-size: 11px;
	font-weight: 700;
	letter-spacing: .16em;
	text-transform: uppercase;
	cursor: pointer;
}

.be-wish-items { flex: 1; overflow-y: auto; }
.be-wish-items[aria-busy="true"] { opacity: .5; }

.be-it {
	display: grid;
	grid-template-columns: 72px minmax(0, 1fr) auto;
	gap: 14px;
	padding: 18px 0;
	border-bottom: 1px solid var(--line, #D8CCBB);
}

.be-it .th {
	display: block;
	width: 72px;
	aspect-ratio: 1;
	overflow: hidden;
	background: radial-gradient(85% 75% at 50% 32%, #FCF8F1 0%, #F1E7D9 55%, #E2D3BF 100%);
	box-shadow: inset 0 0 0 1px rgba(120, 90, 60, .10);
}

.be-it .th img { width: 100%; height: 100%; object-fit: contain; padding: 10%; filter: drop-shadow(0 4px 5px rgba(60, 38, 20, .22)); }
.be-it-b { min-width: 0; }
.be-it h4 { margin: 0; font-size: 14.5px; font-weight: 600; line-height: 1.4; }
.be-it h4 a:hover { color: var(--amber, #B97F35); }
.be-it .s { margin: 2px 0 0; font-size: 12px; color: var(--muted, #5F5346); }
.be-it .ctl { display: flex; align-items: center; gap: 14px; margin-top: 10px; flex-wrap: wrap; }
.be-it .p { font-size: 14px; font-weight: 700; white-space: nowrap; }

.be-add {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 40px;
	padding: 0 16px;
	border: 1px solid var(--text, #16120E);
	background: transparent;
	color: var(--text, #16120E);
	font-family: var(--f);
	font-size: 10.5px;
	font-weight: 700;
	letter-spacing: .14em;
	text-transform: uppercase;
	white-space: nowrap;
	cursor: pointer;
	transition: background .2s, color .2s;
}

.be-add:hover { background: var(--ink2, #16120E); color: var(--bone, #EFE5D4); }
.be-add[aria-busy="true"] { opacity: .6; }

.be-rm {
	min-height: 32px;
	padding: 0;
	border: 0;
	background: none;
	color: var(--soft, #7A6D5E);
	font-family: var(--f);
	font-size: 10.5px;
	font-weight: 700;
	letter-spacing: .14em;
	text-transform: uppercase;
	text-decoration: underline;
	cursor: pointer;
}

.be-rm:hover { color: var(--text, #16120E); }

.be-empty {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 14px;
	padding: 48px 0;
}

.be-empty b { font-size: 19px; font-weight: 600; }
.be-empty p { margin: 0; color: var(--muted, #5F5346); }

/* ------------------------------------------------------------------ Menu Cart off-canvas (Pro) */
.be-icons .elementor-menu-cart__container { z-index: 9982; background-color: rgba(11, 9, 8, .55); }

.be-icons .elementor-menu-cart__main {
	width: min(440px, 100%) !important;
	max-width: 100%;
	padding: calc(20px + env(safe-area-inset-top, 0px)) max(24px, env(safe-area-inset-right, 0px)) calc(20px + env(safe-area-inset-bottom, 0px)) 24px !important;
	background: var(--be-drawer-bg, var(--paper, #F4EDE2)) !important;
	color: var(--text, #16120E);
	box-shadow: -20px 0 60px rgba(0, 0, 0, .2);
	gap: 0 !important;
}

.be-icons .elementor-menu-cart__close-button { display: none !important; }

.be-cart-head { margin-bottom: 0; }

.be-ship {
	display: flex;
	flex-direction: column;
	gap: 10px;
	padding: 16px 0;
	border-bottom: 1px solid var(--line, #D8CCBB);
	font-size: 13px;
	color: var(--muted, #5F5346);
}

.be-ship .b { position: relative; height: 3px; background: var(--line, #D8CCBB); }
.be-ship .b i { position: absolute; inset: 0 auto 0 0; background: var(--text, #16120E); transition: width .5s; }

.be-icons .elementor-menu-cart__products { flex: 1; overflow-y: auto; }

.be-icons .elementor-menu-cart__product {
	padding: 18px 0 !important;
	border-bottom: 1px solid var(--line, #D8CCBB) !important;
	border-color: var(--line, #D8CCBB) !important;
}

.be-icons .elementor-menu-cart__product-image img {
	background: radial-gradient(85% 75% at 50% 32%, #FCF8F1 0%, #F1E7D9 55%, #E2D3BF 100%);
	object-fit: contain;
	padding: 10%;
}

.be-icons .elementor-menu-cart__product-name a { font-size: 14.5px; font-weight: 600; color: var(--text, #16120E); }
.be-icons .elementor-menu-cart__product-name .variation { font-size: 12px; color: var(--muted, #5F5346); }
.be-icons .elementor-menu-cart__product-price { font-size: 14px; font-weight: 700; color: var(--text, #16120E); }

.be-icons .elementor-menu-cart__subtotal {
	display: flex;
	justify-content: space-between;
	padding: 16px 0 0 !important;
	border-top: 1px solid var(--line, #D8CCBB) !important;
	border-bottom: 0 !important;
	font-size: 15px;
	font-weight: 700;
	text-align: left !important;
	color: var(--text, #16120E);
}

.be-cart-fine { margin: 10px 0 0; font-size: 12px; color: var(--soft, #7A6D5E); }

.be-icons .elementor-menu-cart__footer-buttons {
	display: flex !important;
	flex-direction: column;
	gap: 10px !important;
	padding-top: 10px !important;
}

.be-icons .elementor-menu-cart__footer-buttons .elementor-button {
	min-height: 52px;
	border-radius: 0;
	font-family: var(--f);
	font-size: 12px;
	font-weight: 600;
	letter-spacing: .18em;
	text-transform: uppercase;
}

.be-icons .elementor-menu-cart__footer-buttons .elementor-button--view-cart {
	background: transparent;
	color: var(--text, #16120E);
	border: 1.5px solid var(--ink2, #16120E);
}

.be-icons .elementor-menu-cart__footer-buttons .elementor-button--checkout {
	background: var(--ink2, #16120E);
	color: var(--bone, #EFE5D4);
	border: 1.5px solid var(--ink2, #16120E);
}

.be-icons .elementor-menu-cart__footer-buttons .elementor-button:hover { background: var(--amber, #B97F35); border-color: var(--amber, #B97F35); color: #fff; }

.be-icons .woocommerce-mini-cart__empty-message { padding: 48px 0 14px; font-size: 19px; font-weight: 600; text-align: left; color: var(--text, #16120E); }
.be-cart-empty p { margin: 0 0 14px; color: var(--muted, #5F5346); }

/* ------------------------------------------------------------------ quick view */
.be-modal {
	position: fixed;
	inset: 0;
	z-index: 9981;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 24px var(--gr, 32px) 24px var(--gl, 32px);
}

.be-modal[hidden] { display: none; }

.be-mc {
	position: relative;
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
	width: min(960px, 100%);
	max-height: 100%;
	overflow-y: auto;
	background: var(--paper, #F4EDE2);
	color: var(--text, #16120E);
	box-shadow: 0 30px 80px rgba(0, 0, 0, .3);
}

.be-mi {
	position: relative;
	aspect-ratio: 1;
	background: var(--tile, #E3D8C6);
}

.be-mi.studio {
	background:
		radial-gradient(70% 55% at 50% 36%, rgba(255, 250, 242, .95), rgba(255, 250, 242, 0) 70%),
		linear-gradient(180deg, #EDE4D8 0%, #E4D8C8 70%, #D6C6B0 70.2%, #E1D3C0 80%, #CDBBA3 100%);
}

.be-mi img { width: 100%; height: 100%; object-fit: cover; }
.be-mi.studio img { object-fit: contain; padding: 12% 14% 15%; filter: drop-shadow(0 12px 12px rgba(60, 38, 20, .25)); }

.be-mb {
	display: flex;
	flex-direction: column;
	gap: 16px;
	min-width: 0;
	padding: 40px 36px;
}

.be-mb h2 { margin: 0; font-size: clamp(24px, 2.4vw, 32px); font-weight: 600; line-height: 1.15; letter-spacing: -.01em; }
.be-qv-size { margin-bottom: 10px; }

.be-x {
	position: absolute;
	top: 10px;
	right: 10px;
	z-index: 2;
	width: 40px;
	height: 40px;
	padding: 0;
	border: 0;
	border-radius: 50%;
	background: #fff;
	color: var(--text, #16120E);
	display: flex;
	align-items: center;
	justify-content: center;
	cursor: pointer;
}

.be-modal .pyr { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; margin: 0; }
.be-modal .pyr div { min-width: 0; padding: 10px 12px; background: #fff; border: 1px solid var(--line, #D8CCBB); }
.be-modal .pyr .wide { grid-column: 1 / -1; }
.be-modal .pyr dt { font-size: 10px; font-weight: 700; letter-spacing: .18em; text-transform: uppercase; color: var(--soft, #7A6D5E); }
.be-modal .pyr dd { margin: 4px 0 0; font-size: 13px; font-weight: 500; }

.be-modal .sizes { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px; }

.be-modal .size {
	min-height: 56px;
	padding: 0;
	border: 1px solid var(--line, #D8CCBB);
	background: #fff;
	color: var(--text, #16120E);
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 1px;
	font-family: var(--f);
	font-size: 12.5px;
	font-weight: 700;
	cursor: pointer;
}

.be-modal .size span { font-size: 11px; font-weight: 500; color: var(--muted, #5F5346); }
.be-modal .size[aria-pressed="true"] { border: 2px solid var(--text, #16120E); }
.be-modal .size[disabled] { opacity: .4; cursor: not-allowed; }

@media (max-width: 760px) {
	.be-modal { align-items: flex-end; padding: 0; }
	.be-mc { grid-template-columns: 1fr; max-height: 92%; }
	.be-mi { aspect-ratio: 16 / 11; }
	.be-mb { padding: 24px var(--gr, 18px) calc(26px + env(safe-area-inset-bottom, 0px)) var(--gl, 18px); }
}

/* ------------------------------------------------------------------ toast */
.be-toast {
	position: fixed;
	z-index: 9996;
	left: 50%;
	bottom: calc(26px + env(safe-area-inset-bottom, 0px));
	transform: translateX(-50%);
	max-width: calc(100% - 32px);
	padding: 13px 22px;
	background: var(--ink2, #16120E);
	color: var(--bone, #EFE5D4);
	font-size: 11.5px;
	font-weight: 600;
	letter-spacing: .14em;
	text-transform: uppercase;
	box-shadow: 0 14px 40px rgba(0, 0, 0, .3);
}

.be-toast[hidden] { display: none; }

@media (max-width: 760px) {
	.be-toast { bottom: calc(84px + env(safe-area-inset-bottom, 0px)); }
}

@media (prefers-reduced-motion: reduce) {
	.be-hdr-yes,
	.be-nav .elementor-item::after,
	.be-ship .b i { transition: none !important; }
}

/* ------------------------------------------------------------------ demo store notice */
/* WooCommerce → Settings / Customizer → Store notice. A slim brand bar at the bottom that
   never covers the header; it sits above the mobile tab bar. */
.woocommerce-store-notice,
p.demo_store {
	position: fixed !important;
	top: auto !important;
	bottom: 0 !important;
	left: 0;
	right: 0;
	z-index: 9990;
	margin: 0 !important;
	padding: 10px var(--gr, 32px) calc(10px + env(safe-area-inset-bottom, 0px)) var(--gl, 32px) !important;
	background: var(--ink, #0B0908) !important;
	color: var(--ash, #B2A491) !important;
	border-top: 1px solid var(--dline, rgba(239, 229, 212, .14));
	box-shadow: none !important;
	font-family: var(--f) !important;
	font-size: 11px !important;
	font-weight: 500;
	letter-spacing: .12em;
	line-height: 1.6 !important;
	text-align: center;
	text-transform: uppercase;
}

.woocommerce-store-notice a,
.woocommerce-store-notice__dismiss-link {
	margin-left: 14px;
	color: var(--amber-hi, #E0B26A) !important;
	text-decoration: underline;
}

@media (max-width: 560px) {
	.woocommerce-store-notice,
	p.demo_store { font-size: 9.5px !important; letter-spacing: .08em; }
}

@media (max-width: 760px) {
	body:has(.tabbar) .woocommerce-store-notice,
	body:has(.tabbar) p.demo_store { bottom: calc(63px + env(safe-area-inset-bottom, 0px)) !important; padding-bottom: 10px !important; }
}

/* ------------------------------------------------------------------ newsletter card (footer, v43) */
.be-nlx-card {
	position: relative;
	max-width: var(--maxw, 1240px);
	margin-inline: auto;
	overflow: hidden;
	color: #F6ECE3;
}

/* Container decoration (Style → Black Ember decoration): glow + inner hairline frame. */


.be-nlx-k .elementor-heading-title {
	display: flex;
	align-items: center;
	gap: 12px;
}

.be-nlx-k .elementor-heading-title::before {
	content: "";
	flex: none;
	width: 30px;
	height: 1px;
	background: var(--be-nlx-line, #C9A35A);
}

.be-nlx-title .elementor-heading-title em {
	font-style: italic;
	background: linear-gradient(90deg, #F3D9A0, #E08A4E);
	-webkit-background-clip: text;
	background-clip: text;
	color: transparent;
}

.be-nlx-p { max-width: 460px; }
.be-nlx-p p:last-child { margin-bottom: 0; }

/* Pill form: one email field + button (Pro Form). */
.be-nlx-form { max-width: 520px; }

.be-nlx-form .elementor-form-fields-wrapper {
	display: flex !important;
	flex-wrap: nowrap !important;
	align-items: center;
	gap: 10px;
	margin: 0 !important;
	padding: 6px 6px 6px 22px;
	border-radius: 999px;
	background: rgba(255, 255, 255, .06);
	border: 1px solid rgba(233, 201, 135, .3);
	transition: border-color .3s, background .3s;
}

.be-nlx-form .elementor-form-fields-wrapper:focus-within {
	border-color: #F3D9A0;
	background: rgba(255, 255, 255, .09);
}

.be-nlx-form .elementor-field-group {
	flex: 1 1 auto !important;
	width: auto !important;
	min-width: 0;
	margin: 0 !important;
	padding: 0 !important;
}

.be-nlx-form .elementor-field-group.e-form__buttons { flex: 0 0 auto !important; }

.be-nlx-form .elementor-field-textual {
	min-height: 0;
	padding: 12px 0 !important;
	border: 0 !important;
	border-radius: 0;
	background: none !important;
	color: #F6ECE3 !important;
	font-family: var(--f);
	font-size: 15px !important;
	line-height: 17px !important; /* the reference input's line box (its "normal" at 15px) */
	box-shadow: none !important;
}

.be-nlx-form .elementor-field-textual::placeholder { color: rgba(246, 236, 227, .4); }
.be-nlx-form .elementor-field-textual:focus { outline: none; }

.be-nlx-form .elementor-button {
	min-height: 0;
	padding: 14px 22px !important;
	border: 0;
	border-radius: 999px !important;
	background: linear-gradient(135deg, #F3D9A0, #C9A35A) !important;
	color: #1B0B07 !important;
	font-family: var(--f);
	font-size: 11.5px !important;
	font-weight: 700 !important;
	letter-spacing: .16em !important;
	line-height: 1.7 !important;
	text-transform: uppercase;
	transition: transform .3s;
}

.be-nlx-form .elementor-button:hover { transform: translateY(-1px); }
.be-nlx-form .elementor-button .elementor-button-content-wrapper { gap: 10px; }
.be-nlx-form .elementor-button svg { width: 16px; height: 16px; fill: none; stroke: currentColor; transition: transform .3s; }
.be-nlx-form .elementor-button:hover svg { transform: translateX(4px); }

.be-nlx-form .elementor-message {
	margin-top: 10px;
	font-size: 12.5px;
	color: #E9C987 !important;
}

.be-nlx-form .elementor-message::before { display: none; }
.be-nlx-form .elementor-error .elementor-field-textual { border: 0 !important; }
.be-nlx-form .elementor-field-group .elementor-message.elementor-help-inline { position: absolute; }

@media (max-width: 480px) {
	.be-nlx-form .elementor-form-fields-wrapper { flex-direction: column; align-items: stretch; border-radius: 20px; padding: 10px; }
	.be-nlx-form .elementor-field-textual { padding: 10px 12px !important; }
	.be-nlx-form .elementor-button { width: 100%; justify-content: center; }
}

.be-nlx-perks ul {
	display: flex;
	flex-wrap: wrap;
	gap: 10px 26px;
	margin: 0;
	padding: 0;
	list-style: none;
}

.be-nlx-perks li { font-size: 12.5px; line-height: 1.7; color: rgba(246, 236, 227, .7); }

.be-nlx-perks b {
	margin-right: 4px;
	font-family: var(--f-serif);
	font-size: 20px;
	font-weight: 600;
	color: #F3D9A0;
}

/* The reference stacks the newsletter card at 860px (Elementor's Tablet breakpoint is 900px). */
@media (max-width: 860px) {
	.be-site .be-nlx-card.e-con { --e-con-grid-template-columns: minmax(0, 1fr) !important; }
	.be-nlx-card > .be-nlx-r { order: -1; }
}

/* ------------------------------------------------------------------ footer */
.be-foot .be-wrap { max-width: var(--maxw, 1240px); margin-inline: auto; }
.be-f-blurb { max-width: 24em; }
.be-f-blurb p { margin: 0; }
.be-foot .be-logo .be-words { gap: 6px !important; }
.be-f-menu .elementor-nav-menu--main .elementor-item { min-height: 0; padding: 0 !important; line-height: 1.7; }
.be-f-menu .elementor-nav-menu--main .elementor-item::after { display: none; }
.be-f-menu .elementor-nav-menu--layout-vertical > ul > li:not(:last-child) > a { margin-bottom: 9px; }
.be-legal .elementor-heading-title { margin: 0; }

/* Footer columns: 2 columns with the brand on its own row at 820px, as the reference. */
@media (max-width: 820px) {
	.be-site .be-f-grid.e-con { --e-con-grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) !important; }
	.be-f-grid > .be-f-brand { grid-column: 1 / -1; }
}

/* 3-column strips (steps, values) go to one column at 820px, as the reference's .steps3. */
@media (max-width: 820px) {
	.be-site .be-grid3.e-con { --e-con-grid-template-columns: minmax(0, 1fr) !important; }
}

/* Contact form: Name and Email stack at 640px, as the reference. */
@media (max-width: 640px) {
	.be-form .elementor-field-group { width: 100% !important; }
}

/* ------------------------------------------------------------------ Theme Style shield */
/* Site Settings → Buttons / Form fields style every <button> and <input> on the page
   (.elementor-kit-N button). Interface controls keep their own look; the doubled class
   outranks the kit without !important. */
.be-site.be-site :is(button.be-dclose, button.be-rm, button.be-x, button.size, button.be-add, button.be-ibtn) {
	min-height: 0;
	font-family: var(--f);
	line-height: 1.2;
	text-transform: uppercase;
	box-shadow: none;
}

.be-site.be-site button.be-dclose,
.be-site.be-site button.be-dclose:hover,
.be-site.be-site button.be-dclose:focus {
	min-height: 40px;
	padding: 0;
	border: 0;
	background: none;
	color: inherit;
	font-size: 11px;
	font-weight: 700;
	letter-spacing: .16em;
}

.be-site.be-site button.be-rm,
.be-site.be-site button.be-rm:focus {
	min-height: 32px;
	padding: 0;
	border: 0;
	background: none;
	color: var(--soft, #7A6D5E);
	font-size: 10.5px;
	font-weight: 700;
	letter-spacing: .14em;
	text-decoration: underline;
}

.be-site.be-site button.be-rm:hover { background: none; color: var(--text, #16120E); }

.be-site.be-site button.be-add,
.be-site.be-site button.be-add:focus {
	min-height: 40px;
	padding: 0 16px;
	border: 1px solid var(--text, #16120E);
	border-radius: 0;
	background: transparent;
	color: var(--text, #16120E);
	font-size: 10.5px;
	font-weight: 700;
	letter-spacing: .14em;
}

.be-site.be-site button.be-add:hover { background: var(--ink2, #16120E); color: var(--bone, #EFE5D4); }

.be-site.be-site button.be-x,
.be-site.be-site button.be-x:hover,
.be-site.be-site button.be-x:focus {
	width: 40px;
	height: 40px;
	padding: 0;
	border: 0;
	border-radius: 50%;
	background: #fff;
	color: var(--text, #16120E);
}

.be-site.be-site .be-modal button.size,
.be-site.be-site .be-modal button.size:hover,
.be-site.be-site .be-modal button.size:focus {
	min-height: 56px;
	padding: 0;
	border: 1px solid var(--line, #D8CCBB);
	border-radius: 0;
	background: #fff;
	color: var(--text, #16120E);
	font-size: 12.5px;
	font-weight: 700;
	letter-spacing: 0;
	text-transform: none;
}

.be-site.be-site .be-modal button.size[aria-pressed="true"] { border: 2px solid var(--text, #16120E); }

.be-site.be-site button.be-ibtn,
.be-site.be-site button.be-ibtn:focus {
	padding: 0;
	font-size: 0;
	letter-spacing: 0;
}

.be-site.be-site button.be-btn { font-family: var(--f); font-size: 12px; font-weight: 600; letter-spacing: .18em; line-height: 1.2; border-radius: 0; padding: 0 34px; }
.be-site.be-site button.be-btn:not(.out) { background: var(--ink2, #16120E); color: var(--bone, #EFE5D4); border: 1.5px solid var(--ink2, #16120E); }
.be-site.be-site button.be-btn.out { background: transparent; color: var(--text, #16120E); border: 1.5px solid var(--ink2, #16120E); }
.be-site.be-site button.be-btn:not(.out):hover { background: var(--amber, #B97F35); border-color: var(--amber, #B97F35); color: #fff; }
.be-site.be-site button.be-btn.out:hover { background: var(--ink2, #16120E); color: var(--bone, #EFE5D4); }
.be-site.be-site button.be-btn[disabled] { opacity: .4; cursor: not-allowed; }

.be-site.be-site .be-search-panel input[type="search"] {
	padding: 8px 0 14px;
	border: 0;
	border-bottom: 2px solid rgba(239, 229, 212, .3);
	border-radius: 0;
	background: transparent;
	color: var(--sp-text, #EFE5D4);
}

.be-site.be-site .be-search-panel input[type="search"]:focus { border-color: var(--sp-accent, #D7A15C); }

/* Links inside interface layers keep their own colours (Site Settings → Typography → Link). */
.be-site.be-site a.be-sr-item,
.be-site.be-site a.be-sr-item:hover { color: var(--sp-text, #EFE5D4); }
.be-site.be-site .be-it h4 a { color: var(--text, #16120E); }
.be-site.be-site .be-it h4 a:hover { color: var(--amber, #B97F35); }
.be-site.be-site a.be-link { color: var(--soft, #7A6D5E); }
.be-site.be-site a.be-link:hover { color: var(--text, #16120E); }
.be-site.be-site a.be-btn { color: var(--bone, #EFE5D4); }
.be-site.be-site a.be-btn:hover { color: #fff; }
.be-site.be-site .be-icons .elementor-menu-cart__product-name a { color: var(--text, #16120E); }

/* ------------------------------------------------------------------ home: native pieces */
/* Section head link "View all →" (Button widget with class be-link-btn; reference .link). */
.elementor-widget-button.be-link-btn .elementor-button {
	display: inline-flex;
	align-items: center;
	min-height: 40px;
	line-height: 1.2;
	padding: 0 !important;
	border: 0 !important;
	background: none !important;
	transition: color .2s;
}

.be-link-btn .elementor-button-content-wrapper { gap: 8px; transition: gap .2s; }
.be-link-btn .elementor-button:hover .elementor-button-content-wrapper { gap: 12px; }
.be-link-btn .elementor-button-icon svg { width: 16px; height: 10px; fill: none; stroke: currentColor; }
.elementor-widget.be-link-btn { display: flex; line-height: 0; }
.be-shead .elementor-heading-title { margin: 0; }
/* Title column sizes to its content at every width (Elementor makes nested containers 100% on phones),
   so "View all" stays on the title row when it fits, as in the reference. */
.be-shead > .e-con { --width: auto; flex: 0 1 auto; max-width: 100%; }

/* Trust bar items: centred in their cell, left-aligned on 2×2 (reference .trust). */
.be-trust-item .elementor-icon-list-item { justify-content: center; }
/* Reference: 20px icon + 12px gap. Elementor's icon box is wider; "Text indent" is its end padding. */
.be-trust-item .elementor-icon-list-icon { flex: 0 0 auto; width: calc(var(--e-icon-list-icon-size, 20px) + 12px) !important; min-width: 0; padding-inline-end: 12px !important; box-sizing: border-box; }
.be-trust-item .elementor-icon-list-text { padding-inline-start: 0 !important; }
.be-trust-item .elementor-icon-list-icon svg {
	fill: none !important;
	stroke: var(--be-icon-color, currentColor); /* Icon Color control, see class-icon-list-colors.php */
	width: var(--e-icon-list-icon-size, 20px);
	height: var(--e-icon-list-icon-size, 20px);
}
@media (max-width: 900px) {
	.be-trust-item .elementor-icon-list-item { justify-content: flex-start; }
}

/* Icon lists with the line icons (product trust grid): outlined, icon box as wide as the icon,
   the gap is the widget's "Text indent". */
.be-line-icons .elementor-icon-list-icon { flex: 0 0 auto; width: auto !important; min-width: 0; }
.be-line-icons .elementor-icon-list-text { padding-inline-start: 0 !important; }
.be-line-icons .elementor-icon-list-icon svg {
	flex: 0 0 auto;
	margin: 0 !important;
	fill: none !important;
	stroke: var(--be-icon-color, currentColor); /* Icon Color control, see class-icon-list-colors.php */
	width: var(--e-icon-list-icon-size, 18px);
	height: var(--e-icon-list-icon-size, 18px);
}

/* Text Editor blocks that sit in a flex column with their own gap (product page): no outer paragraph margins. */
.be-flow p { margin: 0; }
.be-flow p + p { margin-top: 10px; }

/* Scent-family tiles (Scent Finder; reference .tile): a linked container with a dimmed photo behind its text. */
.be-tile { position: relative; overflow: hidden; aspect-ratio: 16 / 9; color: var(--bone); text-align: center; }
.be-tile > .be-tile-img { position: absolute !important; inset: 0; width: 100% !important; height: 100%; margin: 0 !important; }
.be-tile > .be-tile-img img { width: 100%; height: 100%; object-fit: cover; filter: grayscale(.55) brightness(.55); transition: transform .8s ease, filter .5s; }
.be-tile:hover > .be-tile-img img { transform: scale(1.05); filter: grayscale(.2) brightness(.6); }
.be-tile > .elementor-element:not(.be-tile-img) { position: relative; }
@media (prefers-reduced-motion: reduce) { .be-tile > .be-tile-img img { transition: none; } }

/* Loop Grids: columns may shrink below their content's min width (reference grids use minmax(0, 1fr)),
   so a long button label can't push a 2-column phone grid past the screen edge. */
.elementor-loop-container.elementor-grid { grid-template-columns: repeat(var(--grid-columns, 1), minmax(0, 1fr)); }

/* WooCommerce's add-to-cart.js inserts a "View cart" link after any button that triggers added_to_cart;
   the cart drawer opens instead, so the extra link is never shown. */
.be-site .added_to_cart.wc-forward { display: none !important; }

/* The closed cart drawer leaves the tab order (Pro only fades it out); its own "all .3s" transition keeps
   it visible while it slides away. */
.elementor-widget-woocommerce-menu-cart:not(.elementor-menu-cart--shown) .elementor-menu-cart__main { visibility: hidden; }

/* Visible keyboard focus on text fields whose design has no focus style (constellation search,
   newsletter email): the site's amber ring. */
.be-site .elementor-widget-be-note-search input:focus-visible,
.be-site .be-nlx-form .elementor-form-fields-wrapper:has(input:focus-visible) { outline: 2px solid var(--e-global-color-accent, #B97F35); outline-offset: 3px; }