.arnsc-price-box {
	--arnsc-price-box-columns: 3;
	--arnsc-price-box-column-gap: 24px;
	--arnsc-price-box-row-gap: 24px;
	--arnsc-price-box-content-gap: 20px;
	--arnsc-price-box-media-width: 36%;
	box-sizing: border-box;
	margin-inline: auto;
	width: 100%;
	/* The catalogue layout follows the width of the widget, so a narrow column stacks it as a phone does. */
	container: arnsc-price-box / inline-size;
}

/*
 * As for ARN World Clock: the size-contained widget has no width of its own, so
 * in a wrapping column container (phones) it would get the height of its
 * content laid out at a narrow width. The Width setting under Advanced still
 * applies through --container-widget-width.
 */
.e-con-inner > .elementor-widget-arnsc-price-box,
.e-con > .elementor-widget-arnsc-price-box {
	width: var(--container-widget-width, 100%);
	--flex-grow: var(--container-widget-flex-grow);
}

.arnsc-price-box *,
.arnsc-price-box *::before,
.arnsc-price-box *::after { box-sizing: border-box; }

.arnsc-price-box__heading {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 8px;
	margin-block-end: 36px;
}

.arnsc-price-box__eyebrow {
	font-size: 12px;
	font-weight: 700;
	letter-spacing: .16em;
	line-height: 1.3;
	text-transform: uppercase;
}

.arnsc-price-box__title,
.arnsc-price-box__product-title { margin: 0; }

.arnsc-price-box__heading-description { max-width: 720px; }

.arnsc-price-box__items {
	display: grid;
	gap: var(--arnsc-price-box-row-gap) var(--arnsc-price-box-column-gap);
}

.arnsc-price-box__item {
	position: relative;
	min-width: 0;
	color: inherit;
	text-decoration: none;
	overflow: hidden;
	transition: background-color .2s ease, box-shadow .2s ease, transform .2s ease;
}

.arnsc-price-box--equal .arnsc-price-box__item { height: 100%; }

.arnsc-price-box-hover-lift-yes .arnsc-price-box__item:hover { transform: translateY(-4px); }

.arnsc-price-box__media {
	position: relative;
	min-width: 0;
	overflow: hidden;
}

.arnsc-price-box__media img {
	display: block;
	width: 100%;
	height: 100%;
	max-width: none;
	object-fit: cover;
}

.arnsc-price-box--ratio-square .arnsc-price-box__media { aspect-ratio: 1; }
.arnsc-price-box--ratio-portrait .arnsc-price-box__media { aspect-ratio: 4 / 5; }
.arnsc-price-box--ratio-landscape .arnsc-price-box__media { aspect-ratio: 4 / 3; }
.arnsc-price-box--ratio-wide .arnsc-price-box__media { aspect-ratio: 16 / 9; }
.arnsc-price-box--ratio-auto .arnsc-price-box__media img { height: auto; }

.arnsc-price-box__content {
	display: flex;
	flex: 1 1 auto;
	flex-direction: column;
	min-width: 0;
	gap: 10px;
	/* The title row follows the width of the item text (see the arnsc-price-box-content query). */
	container: arnsc-price-box-content / inline-size;
}

.arnsc-price-box__title-price {
	display: flex;
	align-items: baseline;
	min-width: 0;
	gap: 10px;
}

.arnsc-price-box__product-title {
	flex: 0 1 auto;
	font-size: 20px;
	line-height: 1.2;
}

.arnsc-price-box__product-title a { color: inherit; text-decoration: none; }

.arnsc-price-box__leader {
	flex: 1 1 28px;
	min-width: 18px;
	border-block-end: 1px dotted currentColor;
	opacity: .45;
}

.arnsc-price-box__pricing {
	display: inline-flex;
	align-items: baseline;
	flex: 0 0 auto;
	gap: 6px;
	white-space: nowrap;
}

.arnsc-price-box__old-price { opacity: .58; }
.arnsc-price-box__price { font-size: 18px; }
.arnsc-price-box__price-suffix { opacity: .7; }
.arnsc-price-box__sku { font-size: 12px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; opacity: .68; }
.arnsc-price-box__description { line-height: 1.55; }

.arnsc-price-box__tiers,
.arnsc-price-box__specs {
	margin: 0;
	padding: 0;
	list-style: none;
}

.arnsc-price-box__tiers {
	display: flex;
	flex-wrap: wrap;
	gap: 8px 18px;
}

.arnsc-price-box__tiers li { display: inline-flex; gap: 6px; }
.arnsc-price-box__tiers li span { opacity: .72; }

.arnsc-price-box__specs { display: grid; gap: 4px; }
.arnsc-price-box__specs > div { display: flex; justify-content: space-between; gap: 16px; }
.arnsc-price-box__specs dt { font-weight: 600; }
.arnsc-price-box__specs dd { margin: 0; text-align: end; }

.arnsc-price-box__badge {
	align-self: flex-start;
	display: inline-flex;
	padding: 5px 9px;
	font-size: 11px;
	font-weight: 700;
	letter-spacing: .08em;
	line-height: 1;
	text-transform: uppercase;
}

/* Product grid: one, two or three responsive columns. */
.arnsc-price-box--grid .arnsc-price-box__items { grid-template-columns: repeat(var(--arnsc-price-box-columns), minmax(0, 1fr)); }
.arnsc-price-box--grid .arnsc-price-box__item { display: flex; flex-direction: column; gap: var(--arnsc-price-box-content-gap); }

/* Line-sheet split rows with start, end or alternating media. */
.arnsc-price-box--split .arnsc-price-box__items,
.arnsc-price-box--list .arnsc-price-box__items { grid-template-columns: minmax(0, 1fr); }

.arnsc-price-box--split .arnsc-price-box__item,
.arnsc-price-box--list .arnsc-price-box__item {
	display: grid;
	grid-template-columns: var(--arnsc-price-box-media-width) minmax(0, 1fr);
	grid-template-areas: "media content";
	align-items: center;
	gap: var(--arnsc-price-box-content-gap);
}

.arnsc-price-box--split .arnsc-price-box__item.is-image-end { grid-template-columns: minmax(0, 1fr) var(--arnsc-price-box-media-width); grid-template-areas: "content media"; }
.arnsc-price-box--split .arnsc-price-box__item.has-no-media,
.arnsc-price-box--list .arnsc-price-box__item.has-no-media,
.arnsc-price-box--catalogue .arnsc-price-box__item.has-no-media { grid-template-columns: minmax(0, 1fr); grid-template-areas: "content"; }
.arnsc-price-box__item.has-no-media .arnsc-price-box__content { grid-area: content; }
.arnsc-price-box--split .arnsc-price-box__media,
.arnsc-price-box--list .arnsc-price-box__media { grid-area: media; }
.arnsc-price-box--split .arnsc-price-box__content,
.arnsc-price-box--list .arnsc-price-box__content { grid-area: content; }

/* Compact menu / price-list row. */
.arnsc-price-box--list .arnsc-price-box__item { grid-template-columns: minmax(72px, var(--arnsc-price-box-media-width)) minmax(0, 1fr); }
.arnsc-price-box--list .arnsc-price-box__description { font-size: .92em; }
.arnsc-price-box--list .arnsc-price-box__tiers,
.arnsc-price-box--list .arnsc-price-box__specs { font-size: .88em; }

/* Catalogue mix: one hero item and compact supporting products. */
.arnsc-price-box--catalogue .arnsc-price-box__items { grid-template-columns: minmax(0, 1.35fr) minmax(260px, .85fr); }
.arnsc-price-box--catalogue .arnsc-price-box__item { display: grid; grid-template-columns: minmax(100px, var(--arnsc-price-box-media-width)) minmax(0, 1fr); align-items: center; gap: var(--arnsc-price-box-content-gap); }
.arnsc-price-box--catalogue .arnsc-price-box__item.is-featured { grid-row: span 2; display: flex; flex-direction: column; align-items: stretch; }
.arnsc-price-box--catalogue .arnsc-price-box__item.is-featured .arnsc-price-box__media { width: 100%; }

@container arnsc-price-box (max-width: 1000px) {
	.arnsc-price-box--catalogue .arnsc-price-box__items { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.arnsc-price-box--catalogue .arnsc-price-box__item,
	.arnsc-price-box--catalogue .arnsc-price-box__item.is-featured { grid-row: auto; display: flex; flex-direction: column; align-items: stretch; }
}

@container arnsc-price-box (max-width: 750px) {
	.arnsc-price-box--catalogue .arnsc-price-box__items { grid-template-columns: minmax(0, 1fr); }
}

/* Text narrower than a title, its leader and its price: the price moves under the title instead of squeezing it. */
@container arnsc-price-box-content (max-width: 420px) {
	.arnsc-price-box__title-price { flex-wrap: wrap; }
	.arnsc-price-box__leader { display: none; }
	.arnsc-price-box__pricing { margin-inline-start: auto; }
}

@media (max-width: 767px) {
	.arnsc-price-box--split .arnsc-price-box__item,
	.arnsc-price-box--split .arnsc-price-box__item.is-image-end,
	.arnsc-price-box--list .arnsc-price-box__item {
		grid-template-columns: minmax(0, 1fr);
		grid-template-areas: "media" "content";
	}
}

@media (prefers-reduced-motion: reduce) {
	.arnsc-price-box__item { transition: none; }
	.arnsc-price-box-hover-lift-yes .arnsc-price-box__item:hover { transform: none; }
}