/**
 * BE Arrivals Rail (home §5). Ported from the reference site.css v25 + v26 (final effective
 * rules for .na-rail / .na-card / .na-im / .na-meta / .na-price). Every hard value reads a custom
 * property set by the widget's Style controls; the fallback in each var() is the reference value.
 *
 * The JS positions the cards (absolute, translate3d) and sets the rail height. Until it runs
 * (or when it cannot), the cards sit in a plain row so nothing stacks on top of each other.
 */

.e-con .elementor-widget-be-arrivals-rail {
	width: 100%;
}

.elementor-widget-be-arrivals-rail .na-rail {
	position: relative;
	margin-top: var(--na-top, 34px);
	overflow: hidden;
	min-height: 420px;
}

/* Before the script lays the rail out: a plain row of the visible cards. */
.elementor-widget-be-arrivals-rail .na-rail:not(.na-ready) {
	display: flex;
	gap: calc(var(--na-gap, 24) * 1px);
}

.elementor-widget-be-arrivals-rail .na-rail:not(.na-ready) .na-card {
	position: relative;
	flex: 0 0 calc((100% - (var(--na-n, 4) - 1) * var(--na-gap, 24) * 1px) / var(--na-n, 4));
}

.elementor-widget-be-arrivals-rail .na-rail:not(.na-ready) .na-im {
	aspect-ratio: 1 / var(--na-ratio, 1.38);
}

.elementor-widget-be-arrivals-rail .na-card {
	position: absolute;
	left: 0;
	top: 0;
	display: flex;
	flex-direction: column;
	color: var(--na-name, #1D1714);
	text-decoration: none;
	will-change: transform, opacity;
	backface-visibility: hidden;
	transition:
		transform var(--na-slide, 1.6s) cubic-bezier(.45, .05, .25, 1),
		opacity var(--na-fade, 1.1s) ease;
}

.be-site .elementor-widget-be-arrivals-rail a.na-card:hover,
.be-site .elementor-widget-be-arrivals-rail a.na-card:focus {
	color: var(--na-name, #1D1714);
}

.be-site .elementor-widget-be-arrivals-rail a.na-card:focus-visible {
	outline: none;
}

.be-site .elementor-widget-be-arrivals-rail a.na-card:focus-visible .na-im {
	outline: 2px solid var(--amber, #B97F35);
	outline-offset: -2px;
}

.be-site .elementor-widget-be-arrivals-rail a.na-card:focus-visible .na-meta b {
	text-decoration: underline;
	text-underline-offset: 3px;
}

/* Image well: plain (photo without cut-out). */
.elementor-widget-be-arrivals-rail .na-im {
	display: grid;
	place-items: center;
	background: var(--na-plain, #FFFFFF);
	overflow: hidden;
	box-shadow: 0 18px 40px rgba(40, 24, 12, .08), inset 0 0 0 1px rgba(40, 24, 12, .05);
}

.elementor-widget-be-arrivals-rail .na-im img {
	width: 84%;
	height: 84%;
	object-fit: contain;
	transition: transform .8s cubic-bezier(.2, .7, .2, 1);
}

.elementor-widget-be-arrivals-rail.na-hover-yes .na-card:hover .na-im img {
	transform: scale(1.06);
}

/* Image well with a transparent bottle: two-tone backdrop, arch and plinth (v26). */
.elementor-widget-be-arrivals-rail .na-im.cut {
	position: relative;
	display: flex;
	align-items: flex-end;
	justify-content: center;
	padding-bottom: 15%;
	box-shadow: 0 22px 44px var(--na-shadow, rgba(60, 38, 20, .12));
	background:
		url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 .07 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E"),
		radial-gradient(90% 60% at 50% 18%, rgba(255, 255, 255, .75), rgba(255, 255, 255, 0) 70%),
		linear-gradient(170deg, var(--c1) 0%, var(--c1) 35%, var(--c2) 100%);
}

.elementor-widget-be-arrivals-rail.na-arch-yes .na-im.cut::before {
	content: "";
	position: absolute;
	left: 50%;
	bottom: 14%;
	width: 66%;
	height: 70%;
	transform: translateX(-50%);
	border-radius: 999px 999px 14px 14px;
	background: linear-gradient(180deg, var(--na-arch, rgba(255, 255, 255, .55)), rgba(255, 255, 255, .12) 70%, rgba(255, 255, 255, 0));
	box-shadow: inset 0 0 0 1px var(--na-arch-line, rgba(255, 255, 255, .55));
}

.elementor-widget-be-arrivals-rail.na-arch-yes .na-im.cut::after {
	content: "";
	position: absolute;
	left: 50%;
	bottom: 10%;
	width: 62%;
	height: 9%;
	transform: translateX(-50%);
	border-radius: 50%;
	background:
		radial-gradient(50% 50% at 50% 40%, rgba(255, 255, 255, .85), rgba(255, 255, 255, .35) 60%, rgba(255, 255, 255, 0) 72%),
		radial-gradient(50% 50% at 50% 60%, rgba(40, 24, 12, .18), rgba(40, 24, 12, 0) 75%);
}

.elementor-widget-be-arrivals-rail .na-im.cut img {
	position: relative;
	z-index: 1;
	width: auto;
	height: auto;
	max-width: 54%;
	max-height: 62%;
	object-fit: contain;
	object-position: bottom;
	filter: drop-shadow(0 14px 14px rgba(40, 24, 12, .22));
	transform-origin: 50% 100%;
}

.elementor-widget-be-arrivals-rail.na-hover-yes .na-card:hover .na-im.cut img {
	transform: translateY(-6px) scale(1.04);
}

/* Text under the image. */
.elementor-widget-be-arrivals-rail .na-meta {
	display: flex;
	justify-content: space-between;
	align-items: baseline;
	gap: 12px;
	margin-top: var(--na-meta-gap, 16px);
	line-height: 1.7;
}

.elementor-widget-be-arrivals-rail .na-meta b {
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
	font-family: var(--f, Montserrat, sans-serif);
	font-weight: 500;
	font-size: clamp(15px, 1.45vw, 21px);
	line-height: 1.2;
	color: var(--na-name, #1D1714);
}

.elementor-widget-be-arrivals-rail .na-meta small {
	display: block;
	font-size: 12.5px;
	color: var(--na-brand, #6C6158);
	margin-top: 6px;
}

.elementor-widget-be-arrivals-rail .na-meta i {
	font-style: normal;
	font-size: 12px;
	color: var(--na-year, #6C6158);
}

.elementor-widget-be-arrivals-rail .na-price {
	font-size: 12px;
	letter-spacing: .06em;
	color: var(--na-price, #9A6A2E);
	margin-top: 6px;
	font-weight: 600;
	line-height: 1.7;
}

.elementor-widget-be-arrivals-rail .na-empty {
	margin: 0;
	padding: 24px;
	border: 1px dashed var(--line, #D8CCBB);
	color: var(--muted, #5F5346);
	font-size: 13px;
}

@media (prefers-reduced-motion: reduce) {
	.elementor-widget-be-arrivals-rail .na-card,
	.elementor-widget-be-arrivals-rail .na-im img {
		transition: none;
	}
}