/*
 * VARIALUXE child theme — design system from DESIGN.md.
 * Replaces the parent's sites-style.css, sites-shop.css and style.css rules.
 * Only the values defined in DESIGN.md are used:
 *   colours  : paper, white, blush, line, muted, ink, wine, gold
 *   fonts    : Tajawal (Arabic + UI), Montserrat (Latin names + eyebrows)
 *   type     : 48/56 (36/44) · 32/40 (26/34) · 18/26 · 16/28 · 14/24 · 12/16
 *   spacing  : 8 16 24 32 48 64 96 (4 only inside badges and small icons)
 *   radius   : 2 controls · 8 cards/images · full circles/badges
 *   shadow   : one hover shadow on cards
 */

/* ------------------------------------------------------------------ */
/* 1. Tokens                                                           */
/* ------------------------------------------------------------------ */
:root {
	/* Rose & mauve palette (from the VARIA mockup). Previous values in brackets.
	   paper #FAF6F3 · blush #F1E3DC · line #E7D6D0 · muted #78656D · ink #38262C · wine #682F43 · gold #BB8B79 */
	--paper: #FBF4F7;
	--white: #FFFFFF;
	--blush: #F6E3EC;
	--line: #EBD2DF;
	--muted: #76586B;
	--ink: #3F1D34;
	--wine: #93406F;
	--gold: #C27FA4;

	/* "darken 8%" for primary hover, derived from wine (no new colour value) */
	--wine-hover: color-mix(in srgb, var(--wine) 92%, #000000);

	/* legacy names still used by parent markup and plugins */
	--pink: var(--blush);

	--font-ar: 'Tajawal', sans-serif;
	--font-lat: 'Montserrat', sans-serif;

	--s-1: 8px;
	--s-2: 16px;
	--s-3: 24px;
	--s-4: 32px;
	--s-5: 48px;
	--s-6: 64px;
	--s-7: 96px;

	--r-control: 2px;
	--r-card: 8px;
	--r-full: 999px;

	--shadow-hover: 0 8px 24px rgba(63, 29, 52, 0.10);

	--container: 1200px;
	--gutter: 24px;
	--section-space: 96px;

	/* WooCommerce defaults → brand (removes the purple) */
	--woocommerce: var(--wine);
	--wc-primary: var(--wine);
	--wc-primary-text: var(--white);
	--wc-secondary: var(--blush);
	--wc-secondary-text: var(--ink);
	--wc-highlight: var(--wine);
	--wc-highligh-text: var(--white);
	--wc-content-bg: var(--white);
	--wc-subtext: var(--muted);
	--wc-form-border-color: var(--line);
	--wc-form-border-radius: 2px;
	--wc-card-border-radius: 8px;
}

@media (max-width: 700px) {
	:root {
		--gutter: 16px;
		--section-space: 64px;
	}
}

/* ------------------------------------------------------------------ */
/* 2. Base                                                             */
/* ------------------------------------------------------------------ */
*,
*::before,
*::after { box-sizing: border-box; }

html { scroll-behavior: smooth; scroll-padding-top: 96px; }

body {
	margin: 0;
	background: var(--paper);
	color: var(--ink);
	font-family: var(--font-ar);
	font-size: 16px;
	line-height: 28px;
	font-weight: 400;
	overflow-x: hidden;
}

h1, h2, h3, h4, p { margin-top: 0; }

h1, h2, h3, h4,
.lead, .section-heading, .announcement, header nav, footer, .mobile-dock,
button, input, textarea, select {
	font-family: var(--font-ar);
	letter-spacing: normal;
}

h1 { font-size: 48px; line-height: 56px; font-weight: 500; }
h2 { font-size: 32px; line-height: 40px; font-weight: 500; }
h3 { font-size: 18px; line-height: 26px; font-weight: 500; }

@media (max-width: 700px) {
	h1 { font-size: 36px; line-height: 44px; }
	h2 { font-size: 26px; line-height: 34px; }
}

small,
.muted { font-size: 14px; line-height: 24px; font-weight: 400; }
.muted { color: var(--muted); }

a { color: var(--wine); text-decoration: none; }
a:hover { text-decoration: underline; }
header a, nav a, .product-card a, .brand-logo, .primary, .secondary { text-decoration: none; }
header a:hover, .product-card a:hover, .brand-logo:hover, .primary:hover, .secondary:hover { text-decoration: none; }

button { cursor: pointer; color: inherit; border: 0; font: inherit; }
button:disabled { opacity: .4; cursor: default; }
button, a, input { touch-action: manipulation; }
[hidden] { display: none !important; }

:is(a, button, input, select, textarea, summary):focus-visible {
	outline: 2px solid var(--wine);
	outline-offset: 4px;
}

img { max-width: 100%; height: auto; }

/* Latin names, brands and eyebrows use Montserrat */
.english,
.eyebrow,
.brand-strip > b,
.pack-label b,
.card-bottom strong,
.bundle-bottom strong,
.detail-price,
.order-reference,
[lang="en"] {
	font-family: var(--font-lat);
}

/* Eyebrow: Latin uppercase 12/16, letter-spacing .12em, weight 500 */
.eyebrow {
	display: block;
	font-size: 12px;
	line-height: 16px;
	letter-spacing: .12em;
	font-weight: 500;
	text-transform: uppercase;
	color: var(--muted);
}

/* Any eyebrow or badge that carries Arabic text keeps the 14px Arabic minimum
   (class added by design.js). */
.eyebrow.has-ar,
.tag.has-ar,
.badge.has-ar,
.stock-label.has-ar,
.availability.has-ar {
	font-size: 14px;
	line-height: 24px;
	letter-spacing: normal;
}

.skip { position: fixed; top: -96px; inset-inline-start: 16px; background: var(--white); z-index: 100; padding: 16px; }
.skip:focus { top: 0; }

/* ------------------------------------------------------------------ */
/* 3. Layout helpers                                                   */
/* ------------------------------------------------------------------ */
.section,
.brand-strip,
.native-content,
.breadcrumbs,
.product-detail,
footer,
header {
	padding-inline: max(var(--gutter), calc((100% - var(--container)) / 2));
}

.section { padding-block: var(--section-space); }

/* ------------------------------------------------------------------ */
/* 4. Buttons                                                          */
/* ------------------------------------------------------------------ */
.primary,
.secondary,
.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button,
.woocommerce #respond input#submit,
.woocommerce a.button.alt,
.woocommerce button.button.alt,
.woocommerce input.button.alt,
.wc-block-components-button:not(.is-link),
.collection-search button,
.cwginstock-subscribe-form input[type=submit] {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	height: 48px;
	min-height: 48px;
	padding: 0 32px;
	border-radius: var(--r-full);
	font-family: var(--font-ar);
	font-size: 16px;
	line-height: 24px;
	font-weight: 500;
	text-decoration: none;
	transition: background-color .2s, color .2s;
	transform: none;
	box-shadow: none;
}

/* Primary */
.primary,
.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button,
.woocommerce #respond input#submit,
.woocommerce a.button.alt,
.woocommerce button.button.alt,
.woocommerce input.button.alt,
.wc-block-components-button:not(.is-link),
.collection-search button,
.cwginstock-subscribe-form input[type=submit] {
	background: var(--wine) !important;
	color: var(--white) !important;
	border: 1px solid var(--wine);
}

.primary:hover,
.woocommerce a.button:hover,
.woocommerce button.button:hover,
.woocommerce input.button:hover,
.woocommerce #respond input#submit:hover,
.woocommerce a.button.alt:hover,
.woocommerce button.button.alt:hover,
.woocommerce input.button.alt:hover,
.wc-block-components-button:not(.is-link):hover,
.collection-search button:hover,
.cwginstock-subscribe-form input[type=submit]:hover {
	background: var(--wine-hover) !important;
	border-color: var(--wine-hover);
	transform: none;
}

/* Secondary */
.secondary {
	background: transparent;
	color: var(--ink);
	border: 1px solid var(--ink);
}
.secondary:hover { background: transparent; color: var(--ink); }

/* The "light" primary on the wine banner: still one primary in its section,
   shown in reverse so it stays visible on wine. */
.primary.light {
	background: var(--white) !important;
	color: var(--wine) !important;
	border-color: var(--white);
}
.primary.light:hover { background: var(--blush) !important; border-color: var(--blush); }

.wide { width: 100%; }

/* Text link */
.text-btn {
	background: none;
	padding: 0;
	color: var(--wine);
	font-size: 16px;
	line-height: 28px;
	text-decoration: none;
}
.text-btn:hover { text-decoration: underline; }

/* ------------------------------------------------------------------ */
/* 5. Announcement bar + header                                        */
/* ------------------------------------------------------------------ */
.announcement {
	background: var(--wine);
	color: var(--white);
	text-align: center;
	font-size: 14px;
	line-height: 24px;
	padding: 8px 16px;
	letter-spacing: normal;
}
.announcement span { padding: 0 16px; color: var(--gold); }

header {
	position: sticky;
	top: 0;
	z-index: 20;
	height: auto;
	min-height: 96px;
	background: var(--paper);
	backdrop-filter: none;
	border-bottom: 1px solid var(--line);
	padding-block: 8px;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 24px;
}
body.admin-bar > header { top: 32px; }

.brand-logo { display: block; line-height: 0; flex-shrink: 0; }
header .vlx-refined-brand { display: block; width: 176px; height: 88px; }
.brand-logo img { display: block; width: 176px; height: auto; }

header nav {
	display: flex;
	gap: 32px;
	font-size: 16px;
	line-height: 28px;
}
header nav a { color: var(--ink); }
header nav a:hover { color: var(--wine); }

.nav-actions { display: flex; align-items: center; gap: 8px; }

header .nav-actions :is(.bag, .search-link, .account-link) {
	position: relative;
	width: 44px;
	height: 44px;
	min-width: 44px;
	min-height: 44px;
	padding: 0;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	color: var(--wine);
	background: var(--white);
	border: 1px solid var(--line);
	border-radius: var(--r-full);
	font-size: 16px;
}
header .nav-actions :is(.bag, .search-link, .account-link, .lang-switch):hover { background: var(--blush); }

/* Language switch: globe + language code, beside the bag */
header .nav-actions .lang-switch {
	display: inline-flex;
	align-items: center;
	gap: 4px;
	height: 44px;
	min-width: 44px;
	padding: 0 12px;
	color: var(--wine);
	background: var(--white);
	border: 1px solid var(--line);
	border-radius: var(--r-full);
	text-decoration: none;
}
header .nav-actions .lang-switch svg { flex: none; }
header .nav-actions .lang-switch span {
	font-family: var(--font-lat);
	font-size: 14px;
	line-height: 16px;
	font-weight: 500;
	letter-spacing: .04em;
}
header .nav-actions .lang-switch span:lang(ar) { font-family: var(--font-ar); font-size: 16px; }
/* Signed-in dot on the account icon */
header .account-link .account-dot {
	position: absolute;
	inset-block-end: 6px;
	inset-inline-end: 6px;
	width: 10px;
	height: 10px;
	border: 2px solid var(--white);
	border-radius: var(--r-full);
	background: var(--gold);
}
/* The header switch replaces TranslatePress's floating button */
.trp-language-switcher.trp-floating-switcher { display: none !important; }
header .vlx-bag-icon { display: block; flex: none; }
header .vlx-bag-icon path[stroke]:not([stroke="currentColor"]) { stroke: var(--gold); }
header .vlx-bag-label {
	position: absolute; width: 1px; height: 1px; overflow: hidden;
	clip-path: inset(50%); white-space: nowrap;
}

/* Cart count badge */
[data-count] {
	font-family: var(--font-lat);
}
header .bag [data-count] {
	position: absolute;
	inset-block-start: -4px;
	inset-inline-end: -4px;
	min-width: 24px;
	height: 24px;
	padding: 0 4px;
	display: grid;
	place-items: center;
	margin: 0;
	border: 1px solid var(--white);
	border-radius: var(--r-full);
	background: var(--wine);
	color: var(--white);
	font-size: 12px;
	line-height: 16px;
	font-weight: 500;
}

/* Logo text inside the inline header SVG keeps its artwork; only colours are tokens */
header .vlx-refined-brand .vlx-brand-tagline { fill: var(--muted); }

@media (max-width: 1000px) {
	header nav { gap: 16px; }
}

@media (max-width: 782px) {
	body.admin-bar > header { top: 46px; }
}
@media (max-width: 600px) {
	body.admin-bar > header { top: 0; }
}

@media (max-width: 700px) {
	.announcement span { padding: 0 8px; }
	header {
		flex-wrap: wrap;
		gap: 8px 16px;
		min-height: 0;
		padding-block: 8px;
	}
	header .vlx-refined-brand { width: 144px; height: 72px; }
	header .vlx-brand-tagline { display: none; }
	header nav a {
		display: inline-flex;
		align-items: center;
		min-height: 44px;
	}
	header nav {
		order: 3;
		width: 100%;
		gap: 0 16px;
		flex-wrap: wrap;
		justify-content: space-between;
		font-size: 14px;
		line-height: 24px;
		padding-bottom: 8px;
	}
}

/* ------------------------------------------------------------------ */
/* 6. Hero (two columns: copy + featured product)                      */
/* ------------------------------------------------------------------ */
.hero {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 48px;
	align-items: center;
	min-height: 0;
	padding-block: var(--section-space);
	padding-inline: max(var(--gutter), calc((100% - var(--container)) / 2));
}

.hero-copy {
	padding: 0;
	display: flex;
	flex-direction: column;
	justify-content: center;
}

.hero-copy h1,
.hero h1 {
	font-size: 48px;
	line-height: 56px;
	font-weight: 500;
	letter-spacing: normal;
	margin: 16px 0 24px;
}

.hero h1 em { font-style: normal; color: var(--wine); position: relative; font-weight: 500; }
/* gold underline under one word */
.hero h1 em::after {
	content: '';
	position: absolute;
	inset-inline: 0;
	bottom: -4px;
	height: 0;
	border-top: 2px solid var(--gold);
	border-radius: 0;
	width: auto;
}

.hero-copy > p {
	color: var(--muted);
	font-size: 16px;
	line-height: 28px;
	margin: 0;
}

.hero-cta { display: flex; flex-wrap: wrap; gap: 16px; margin: 32px 0; }

.hero-foot {
	display: flex;
	flex-wrap: wrap;
	gap: 8px 16px;
	align-items: center;
	font-size: 14px;
	line-height: 24px;
	color: var(--muted);
}
.hero-foot i { font-style: normal; color: var(--gold); }

/* Featured product panel: flat blush, no gradients */
.hero-scene {
	position: relative;
	overflow: hidden;
	min-height: 0;
	aspect-ratio: 4 / 5;
	width: 100%;
	max-width: 448px;
	justify-self: center;
	background: var(--blush);
	border-radius: var(--r-card);
	direction: ltr;
}

.hero-scene .orbit { display: none; }

.hero-letter {
	position: absolute;
	inset: 16%;
	width: auto;
	height: auto;
	font-size: 0;
	opacity: .24;
	color: transparent;
	letter-spacing: normal;
}
.hero-letter img,
.hero-letter .vlx-seal { display: block; width: 100%; height: 100%; object-fit: contain; }

.scene-top,
.scene-caption {
	position: absolute;
	inset-inline: 24px;
	display: flex;
	justify-content: space-between;
	gap: 16px;
	z-index: 3;
	color: var(--muted);
	font-family: var(--font-lat);
	font-size: 12px;
	line-height: 16px;
	letter-spacing: .12em;
	font-weight: 500;
	text-transform: uppercase;
}
.scene-top { top: 24px; }
.scene-caption { bottom: 24px; }
.scene-caption span { color: var(--gold); }

.hero-sticker {
	position: absolute;
	inset-inline-start: 24px;
	top: 64px;
	z-index: 5;
	width: 96px;
	height: 96px;
	border-radius: var(--r-full);
	border: 1px solid var(--gold);
	background: var(--paper);
	transform: none;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	text-align: center;
	color: var(--wine);
	font-size: 14px;
	line-height: 24px;
}
.hero-sticker em { font-family: var(--font-lat); font-style: normal; font-size: 12px; line-height: 16px; color: var(--muted); }

/* Featured product drawing in the hero (restored from the parent theme) */
.hero-scene .hero-product {
	position: absolute;
	inset: 64px 0 48px;
	height: auto;
	aspect-ratio: auto;
	background: none !important;
	overflow: visible;
}
.hero-product .halo { display: none; }
.hero-product .tube { width: 158px; height: 320px; transform: rotate(14deg); margin-left: 64px; margin-top: 48px; }
.hero-product .pack-label { inset: 48px 24px 72px; gap: 32px; }
.hero-product .pack-label b { font-size: 29px; }
.hero-product .pack-label span { font-size: 11px; }
.hero-product .cap { height: 55px; }
.hero-product .art-note { bottom: 16px; right: 24px; }

@media (max-width: 1000px) {
	.hero { gap: 32px; }
}

@media (max-width: 700px) {
	.hero { grid-template-columns: 1fr; gap: 32px; }
	.hero-copy h1, .hero h1 { font-size: 36px; line-height: 44px; }
	.hero-cta { margin: 24px 0; }
	.hero-cta > * { flex: 1 1 auto; }
	.hero-sticker { width: 88px; height: 88px; top: 48px; inset-inline-start: 16px; }
}

/* ------------------------------------------------------------------ */
/* 7. Product drawings (restored from the parent theme at the owner's  */
/*    request, 2026-11-13). The pack artwork keeps its own colours and */
/*    gradients; the frame is the DESIGN.md 4:5 blush image area.      */
/*    Changes vs. the parent: Montserrat instead of DM Sans, the       */
/*    Arabic size on the pack is hidden (it is shown on the card), and */
/*    the "illustrative image" note is 14px.                           */
/* ------------------------------------------------------------------ */
.product-art {
	position: relative;
	aspect-ratio: 4 / 5;
	height: auto;
	width: 100%;
	overflow: hidden;
	display: flex;
	align-items: center;
	justify-content: center;
	background: var(--blush) !important;
	direction: ltr;
}

.halo {
	position: absolute;
	inset: 18% 10% 5%;
	border-radius: 50% 50% 0 0;
	background: #fff4;
	box-shadow: 0 15px 20px #6e3d3910;
}

.pack {
	position: relative;
	z-index: 2;
	filter: drop-shadow(13px 22px 10px #53383925);
	transition: transform .5s;
}
.product-card:hover .pack { transform: translateY(-7px) rotate(-3deg); }

.tube {
	width: 95px;
	height: 191px;
	background: linear-gradient(90deg, #bf7b91, #e8b9c5 36%, #c88a9f 85%, #ae6b84);
	border-radius: 8px 8px 19px 19px;
	transform: rotate(-9deg);
	border-top: 7px solid #dfacbc;
}
.tube .cap {
	position: absolute;
	bottom: 0;
	height: 35px;
	width: 100%;
	background: linear-gradient(90deg, #c38398, #e8bccb, #c58ba0);
	border-top: 1px solid #b5778a;
	border-radius: 0 0 9px 9px;
}

.pack-label {
	position: absolute;
	inset: 26px 10px 45px;
	text-align: center;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 13px;
	color: #633349;
}
.pack-label b { font: 500 17px var(--font-lat); letter-spacing: -.6px; }
.pack-label span { font: 7px var(--font-lat); text-transform: uppercase; line-height: 1.7; letter-spacing: 1px; }
.pack-label small { display: none; }

.sheet {
	width: 150px;
	height: 200px;
	background: linear-gradient(120deg, #fdfbf5, #ddd4c4);
	border: 1px solid #d3cabc;
	border-radius: 2px;
	transform: rotate(8deg);
}
.sheet .pack-label { inset: 15px; }
.sheet .pack-label b { font-size: 18px; letter-spacing: 1px; }
.sheet .pack-label span { font-size: 10px; line-height: 2; }

.bottle {
	width: 95px;
	height: 143px;
	background: linear-gradient(90deg, #d3839d99, #e7a5bcdd, #d58ca3);
	border-radius: 13px 13px 9px 9px;
	transform: rotate(-7deg);
	margin-top: 38px;
	border: 1px solid #c4849799;
}
.bottle .cap {
	position: absolute;
	width: 47px;
	height: 65px;
	background: linear-gradient(90deg, #ded8d2, #fff, #ded8d2);
	top: -59px;
	left: 23px;
	border-radius: 20px 20px 3px 3px;
	border-bottom: 8px solid #e6dedb;
}
.bottle .pack-label { inset: 22px 8px 10px; }
.red .bottle { background: linear-gradient(90deg, #9c282d, #d36b63, #9f3436); }
.red .pack-label { color: #fff4e6; }
.red .pack-label b { font-size: 21px; }

.art-note {
	position: absolute;
	bottom: 8px;
	inset-inline: 8px;
	text-align: center;
	font-size: 14px;
	line-height: 24px;
	color: var(--muted);
}

/* Custom product page (sites-product.php) */
.product-detail > .product-art .pack { scale: 1.8; }

@media (max-width: 1000px) {
	.product-art .pack { scale: .9; }
}
@media (max-width: 700px) {
	.product-art .pack { scale: .8; }
	.product-art .art-note { display: none; }
	.hero-product .tube { width: 130px; height: 263px; margin-top: 0; margin-left: 24px; }
	.hero-product .pack-label b { font-size: 24px; }
	.hero-product .pack-label span { font-size: 9px; }
	.hero-product .pack-label { gap: 16px; inset: 32px 16px 64px; }
	.hero-scene .hero-product { inset: 48px 0 24px; }
	.hero-scene .hero-product .art-note { display: block; }
	.product-detail > .product-art .pack { scale: 1.35; }
}

@media (prefers-reduced-motion: reduce) {
	.product-card:hover .pack { transform: none; }
}

/* Real product photo (when a WooCommerce image exists) */
.actual-product { background: var(--blush); padding: 24px; aspect-ratio: 4 / 5; border-radius: var(--r-card); }
.actual-product img { width: 100%; height: 100%; object-fit: contain; }
.actual-product .image-fallback { font-size: 14px; line-height: 24px; color: var(--muted); }

/* ------------------------------------------------------------------ */
/* 8. Brand strip                                                      */
/* ------------------------------------------------------------------ */
.brand-strip {
	display: flex;
	align-items: center;
	justify-content: space-between;
	flex-wrap: wrap;
	gap: 16px 32px;
	padding-block: 24px;
	background: var(--paper);
	border-block: 1px solid var(--line);
}
.brand-strip > b {
	font-size: 18px;
	line-height: 26px;
	font-weight: 500;
	letter-spacing: .12em;
	text-transform: uppercase;
	color: var(--ink);
}
.brand-strip > b:nth-child(2) { font-weight: 500; letter-spacing: .12em; }
.brand-strip > span { font-size: 14px; line-height: 24px; color: var(--muted); }
.brand-strip > span:first-child {
	font-family: var(--font-lat);
	font-size: 12px;
	line-height: 16px;
	letter-spacing: .12em;
	font-weight: 500;
}

@media (max-width: 700px) {
	.brand-strip { justify-content: center; gap: 8px 24px; }
	.brand-strip > span { display: none; }
}

/* ------------------------------------------------------------------ */
/* 8b. "ابدئي بالخطوة اللي تهمّكِ" (restored from the Sites design)     */
/* ------------------------------------------------------------------ */
.store-discovery { padding-bottom: 0; }
.store-discovery h2 { font-size: 32px; line-height: 40px; font-weight: 500; margin: 0 0 32px; }
.discovery-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; }
.discovery-link {
	display: flex;
	flex-direction: column;
	gap: 8px;
	min-height: 144px;
	padding: 32px;
	background: var(--white);
	border: 1px solid var(--line);
	border-radius: var(--r-card);
	color: var(--ink);
	text-decoration: none;
	transition: box-shadow .2s, border-color .2s;
}
.discovery-link strong { font-size: 18px; line-height: 26px; font-weight: 500; }
.discovery-link span { font-size: 16px; line-height: 28px; color: var(--muted); }
.discovery-link:hover { text-decoration: none; border-color: var(--wine); box-shadow: var(--shadow-hover); }
.discovery-link:hover span { color: var(--wine); }
@media (max-width: 1000px) {
	.discovery-grid { gap: 16px; }
	.discovery-link { padding: 24px; }
}
@media (max-width: 700px) {
	.store-discovery h2 { font-size: 26px; line-height: 34px; margin-bottom: 24px; }
	.discovery-grid { grid-template-columns: 1fr; gap: 16px; }
	.discovery-link { min-height: 0; }
}

/* ------------------------------------------------------------------ */
/* 9. Section headings                                                 */
/* ------------------------------------------------------------------ */
.section-heading {
	display: flex;
	justify-content: space-between;
	align-items: flex-end;
	gap: 24px;
	margin-bottom: 32px;
}
.section-heading h2,
#collection .section-heading h2 {
	font-size: 32px;
	line-height: 40px;
	font-weight: 500;
	margin: 8px 0 0;
	letter-spacing: normal;
}
.section-heading > p,
.section-heading > span,
#collection .section-heading p {
	font-size: 14px;
	line-height: 24px;
	color: var(--muted);
	margin: 0;
}

@media (max-width: 700px) {
	.section-heading { flex-direction: column; align-items: flex-start; gap: 8px; }
	.section-heading h2,
	#collection .section-heading h2 { font-size: 26px; line-height: 34px; }
}

/* ------------------------------------------------------------------ */
/* 10. Collection: filters, search, toolbar, grid                      */
/* ------------------------------------------------------------------ */
#collection { scroll-margin-top: 96px; }

.collection-tools,
#collection .collection-tools {
	display: flex;
	justify-content: space-between;
	align-items: center;
	gap: 16px;
	margin-bottom: 24px;
}

.filters { display: flex; flex-wrap: wrap; gap: 8px; }

/* Category pills: height 44, active = ink + white */
.filters button,
#collection [data-filter] {
	height: 44px;
	min-height: 44px;
	padding: 0 16px;
	border-radius: var(--r-full);
	border: 1px solid var(--line);
	background: var(--white);
	color: var(--ink);
	font-size: 14px;
	line-height: 24px;
	font-weight: 500;
	white-space: nowrap;
}
.filters button:hover,
#collection [data-filter]:hover { border-color: var(--ink); }
.filters button.active,
.filters button[aria-pressed=true],
#collection [data-filter][aria-pressed=true] {
	background: var(--ink);
	border-color: var(--ink);
	color: var(--white);
}

.search-box,
#collection .search-box {
	display: flex;
	align-items: center;
	gap: 8px;
	min-height: 48px;
	padding-inline: 16px;
	background: var(--white);
	border: 1px solid var(--line);
	border-radius: var(--r-control);
	color: var(--muted);
}
.search-box span { font-size: 18px; line-height: 26px; }
.search-box input,
#collection #search {
	background: none;
	border: 0;
	width: 240px;
	min-width: 0;
	font-size: 16px;
	line-height: 28px;
	padding: 8px 0;
	color: var(--ink);
}
.search-box input::placeholder { color: var(--muted); }

.shopping-toolbar,
#collection .shopping-toolbar {
	display: flex;
	align-items: center;
	justify-content: space-between;
	flex-wrap: wrap;
	gap: 8px 16px;
	margin: 0 0 24px;
	padding: 8px 0;
	border-block: 1px solid var(--line);
	font-size: 14px;
	line-height: 24px;
}
.shopping-toolbar select,
#collection .shopping-toolbar select {
	min-height: 44px;
	font: inherit;
	background: transparent;
	border: 0;
	color: var(--wine);
	padding: 0 8px;
}
#collection .shopping-toolbar button { min-height: 44px; font-size: 14px; }
.favorite-filter { display: flex; gap: 8px; align-items: center; min-height: 44px; }
input[type=checkbox] { accent-color: var(--wine); margin: 0; }

#collection .vlx-results-count,
.vlx-results-count {
	margin: 0 0 16px;
	color: var(--muted);
	font-size: 14px;
	line-height: 24px;
}

.product-grid,
#collection .product-grid {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 24px;
}

@media (max-width: 1000px) {
	.product-grid, #collection .product-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
}

@media (max-width: 700px) {
	.collection-tools,
	#collection .collection-tools { flex-direction: column; align-items: stretch; }
	.filters { flex-wrap: nowrap; overflow-x: auto; margin-inline: calc(var(--gutter) * -1); padding-inline: var(--gutter); scrollbar-width: none; }
	.filters::-webkit-scrollbar { display: none; }
	.search-box, #collection .search-box { width: 100%; }
	.search-box input, #collection #search { width: 100%; }
	.product-grid, #collection .product-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
}

#no-results { font-size: 16px; color: var(--muted); padding: 24px 0; }
.small-note { margin: 24px 0 0; color: var(--muted); font-size: 14px; line-height: 24px; }

/* ------------------------------------------------------------------ */
/* 11. Product card                                                    */
/* white · 1px line · radius 8 · 4:5 blush image · brand · AR · EN ·   */
/* size + price on one line · 44×44 round add + favourite             */
/* ------------------------------------------------------------------ */
.product-card,
#collection .product-card {
	position: relative;
	min-width: 0;
	display: flex;
	flex-direction: column;
	background: var(--white);
	border: 1px solid var(--line);
	border-radius: var(--r-card);
	overflow: hidden;
	box-shadow: none;
	transform: none;
	transition: box-shadow .2s;
}
#collection .product-card[hidden] { display: none; }

@media (hover: hover) {
	.product-card:hover,
	#collection .product-card:hover {
		box-shadow: var(--shadow-hover);
		transform: none;
	}
}

.art-link { display: block; position: relative; overflow: hidden; border-radius: 0; }

/* Badge (tag on image, stock label) */
.tag,
.badge {
	position: absolute;
	top: 16px;
	inset-inline-end: 16px;
	z-index: 4;
	display: inline-block;
	padding: 4px 8px;
	border-radius: var(--r-full);
	background: var(--blush);
	color: var(--wine);
	font-size: 12px;
	line-height: 16px;
	font-weight: 500;
}
.product-art + .tag, .art-link .tag { background: var(--white); }

.card-body,
#collection .card-body {
	display: flex;
	flex-direction: column;
	flex: 1;
	padding: 16px;
}

/* brand (Montserrat 12 uppercase muted) */
.card-body .eyebrow { order: 1; color: var(--muted); font-size: 12px; line-height: 16px; letter-spacing: .12em; margin: 0 0 8px; }
.card-body .eyebrow.has-ar { font-size: 14px; line-height: 24px; letter-spacing: normal; }
.card-body .eyebrow .vlx-size { display: none; }

/* Arabic name H3 */
.card-body h3,
#collection .card-body h3 {
	order: 2;
	font-size: 18px;
	line-height: 26px;
	font-weight: 500;
	margin: 0;
	letter-spacing: normal;
}
.card-body h3 a { color: var(--ink); }
.card-body h3 a:hover { color: var(--wine); }

/* English name 14 muted */
.english,
#collection .card-body .english {
	order: 3;
	font-size: 14px;
	line-height: 24px;
	color: var(--muted);
	text-align: start;
	margin: 0;
	overflow-wrap: anywhere;
}

/* stock status: wine on blush (not green) */
.stock-label,
.availability,
.stock-label[data-stock=available] {
	order: 4;
	align-self: flex-start;
	display: inline-block;
	margin: 8px 0 0;
	padding: 4px 8px;
	border-radius: var(--r-full);
	background: var(--blush);
	color: var(--wine);
	font-size: 12px;
	line-height: 16px;
	font-weight: 500;
}
.stock-label[data-stock=out_of_stock] { background: var(--paper); color: var(--muted); }

/* size + price + add on one line */
.card-bottom {
	order: 5;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 8px;
	margin-top: auto;
	padding-top: 16px;
}
.card-bottom .vlx-card-meta { display: flex; align-items: baseline; gap: 8px; min-width: 0; flex-wrap: wrap; }
.card-bottom .vlx-card-size { font-size: 14px; line-height: 24px; color: var(--muted); }
.card-bottom strong,
#collection .card-bottom strong {
	font-family: var(--font-lat);
	font-size: 16px;
	line-height: 28px;
	font-weight: 500;
	color: var(--wine);
	white-space: nowrap;
}
.card-bottom strong small { font-family: var(--font-ar); font-size: 14px; line-height: 24px; font-weight: 500; }

/* Narrow cards: size + price keep one full line, the add button sits under it */
@media (max-width: 1000px) {
	.card-bottom { flex-wrap: wrap; }
	.card-bottom .vlx-card-meta { flex: 1 0 100%; flex-wrap: nowrap; justify-content: space-between; white-space: nowrap; }
	.card-bottom .add { margin-inline-start: auto; }
}

/* Round 44×44 action buttons: add + favourite */
.add,
.favorite-button,
#collection .card-bottom .add,
#collection .card-options button {
	width: 44px;
	height: 44px;
	min-width: 44px;
	min-height: 44px;
	padding: 0;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	flex: none;
	border-radius: var(--r-full);
	border: 1px solid var(--line);
	background: var(--white);
	color: var(--wine);
	font-size: 18px;
	line-height: 26px;
}
.add:hover { background: var(--wine); border-color: var(--wine); color: var(--white); }
.favorite-button:hover { background: var(--blush); }
.favorite-button[aria-pressed=true] { color: var(--wine); background: var(--blush); border-color: var(--blush); }

.card-options,
#collection .card-options {
	order: 6;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 8px;
	min-height: 44px;
	margin: 16px 16px 16px;
	padding-top: 16px;
	border-top: 1px solid var(--line);
}
.card-body + .card-options { margin-top: 0; }
.card-options label,
#collection .card-options label {
	min-height: 44px;
	display: inline-flex;
	align-items: center;
	gap: 8px;
	font-size: 14px;
	line-height: 24px;
	color: var(--muted);
}

/* ------------------------------------------------------------------ */
/* 12. "Help me choose" banner                                         */
/* ------------------------------------------------------------------ */
.ritual-banner {
	position: relative;
	overflow: hidden;
	background: var(--wine);
	color: var(--white);
	text-align: center;
	margin: 0 max(var(--gutter), calc((100% - var(--container)) / 2));
	padding: 64px 24px;
	border: 0;
	border-radius: var(--r-card);
}
.ritual-banner::before { content: none; }
.ritual-banner .eyebrow { color: var(--blush); }
.ritual-banner h2 { font-size: 32px; line-height: 40px; font-weight: 500; margin: 16px 0; color: var(--white); }
.ritual-banner p { font-size: 16px; line-height: 28px; color: var(--blush); margin: 0 0 32px; }
.banner-star { position: absolute; inset-inline-start: 24px; top: 24px; font-size: 48px; line-height: 56px; color: var(--gold); opacity: .4; }

@media (max-width: 700px) {
	.ritual-banner { padding: 48px 16px; }
	.ritual-banner h2 { font-size: 26px; line-height: 34px; }
}

/* ------------------------------------------------------------------ */
/* 13. Bundles                                                         */
/* ------------------------------------------------------------------ */
.bundle-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; }

.bundle,
.rose-bundle,
.cream-bundle {
	display: grid;
	grid-template-columns: 2fr 3fr;
	align-items: stretch;
	overflow: hidden;
	background: var(--white);
	border: 1px solid var(--line);
	border-radius: var(--r-card);
}

.bundle > div:last-child { padding: 24px; display: flex; flex-direction: column; }
.bundle h3 { font-size: 18px; line-height: 26px; font-weight: 500; margin: 8px 0; }
.bundle p { font-size: 14px; line-height: 24px; color: var(--muted); margin: 0 0 8px; }

.bundle-art {
	display: flex;
	height: auto;
	min-height: 100%;
	direction: ltr;
	align-items: stretch;
	background: var(--blush);
	overflow: hidden;
}
/* Two pack drawings overlapping, as in the parent theme */
.bundle-art { justify-content: center; align-items: center; min-height: 256px; }
.bundle-art .product-art {
	width: 50%;
	min-width: 96px;
	height: 256px;
	aspect-ratio: auto;
	overflow: visible;
	background: none !important;
}
.bundle-art .pack { scale: .75; }
.bundle-art .product-art:first-child { z-index: 2; margin-right: -32px; }
.bundle-art .halo,
.bundle-art .art-note { display: none; }

.bundle-saving { display: block; font-size: 14px; line-height: 24px; color: var(--wine); margin: 0 0 16px; }

.bundle-bottom {
	display: flex;
	flex-wrap: wrap;
	gap: 16px;
	align-items: center;
	justify-content: space-between;
	margin-top: auto;
}
.bundle-bottom strong {
	font-size: 18px;
	line-height: 26px;
	font-weight: 500;
	color: var(--wine);
	white-space: nowrap;
}
.bundle-bottom strong small { font-family: var(--font-ar); font-size: 14px; }
.bundle-bottom button { font-size: 16px; padding: 0 24px; gap: 8px; }

@media (max-width: 1000px) {
	.bundle-grid { grid-template-columns: 1fr; }
}
@media (max-width: 700px) {
	.bundle { grid-template-columns: 1fr; }
	.bundle-art { aspect-ratio: auto; min-height: 224px; }
	.bundle-art .product-art { height: 224px; }
	.bundle-art .pack { scale: .65; }
	.bundle > div:last-child { padding: 16px; }
	.bundle-bottom button { width: 100%; }
}

/* ------------------------------------------------------------------ */
/* 14. Clarity ("الثقة تبدأ من التفاصيل")                              */
/* ------------------------------------------------------------------ */
.clarity {
	display: grid;
	grid-template-columns: 1fr 2fr;
	gap: 64px;
	margin-top: 0;
	background: var(--blush);
}
.clarity h2 { font-size: 32px; line-height: 40px; font-weight: 500; margin: 16px 0 24px; }
.clarity a { font-size: 16px; line-height: 28px; color: var(--wine); border-bottom: 0; }
.clarity a:hover { text-decoration: underline; }

.principles { display: grid; grid-template-columns: repeat(3, 1fr); gap: 32px; align-items: start; }
.principles article > span {
	display: block;
	margin: 0 0 16px;
	font-family: var(--font-lat);
	font-size: 12px;
	line-height: 16px;
	letter-spacing: .12em;
	font-weight: 500;
	color: var(--gold);
}
.principles h3 { font-size: 18px; line-height: 26px; font-weight: 500; margin: 0 0 8px; }
.principles p { color: var(--muted); font-size: 16px; line-height: 28px; margin: 0; }

@media (max-width: 1000px) {
	.clarity { gap: 32px; }
	.principles { gap: 24px; }
}
@media (max-width: 700px) {
	.clarity { grid-template-columns: 1fr; gap: 32px; }
	.clarity h2 { font-size: 26px; line-height: 34px; }
	.principles { grid-template-columns: 1fr; }
}

/* ------------------------------------------------------------------ */
/* 15. FAQ                                                             */
/* ------------------------------------------------------------------ */
.faq,
.section.faq {
	max-width: none;
	padding-inline: max(var(--gutter), calc((100% - 800px) / 2));
}
.faq h2 { font-size: 32px; line-height: 40px; font-weight: 500; margin: 8px 0 32px; }
details { border-bottom: 1px solid var(--line); padding: 16px 0; }
summary {
	cursor: pointer;
	list-style: none;
	display: flex;
	justify-content: space-between;
	align-items: center;
	gap: 16px;
	min-height: 44px;
	font-size: 18px;
	line-height: 26px;
	font-weight: 500;
}
summary::-webkit-details-marker { display: none; }
summary::after { content: '＋'; float: none; color: var(--wine); flex: none; }
details[open] summary::after { content: '−'; }
details p { font-size: 16px; line-height: 28px; color: var(--muted); margin: 16px 0 0; }

@media (max-width: 700px) {
	.faq h2 { font-size: 26px; line-height: 34px; }
}

/* ------------------------------------------------------------------ */
/* 16. Footer                                                          */
/* ------------------------------------------------------------------ */
footer {
	display: grid;
	grid-template-columns: 1.2fr .8fr .8fr 1.2fr;
	gap: 48px;
	padding-top: 64px;
	padding-bottom: 24px;
	background: var(--blush);
	border-top: 1px solid var(--line);
}
footer .brand-logo img,
footer .vlx-footer-brand { display: block; width: 176px; height: auto; }
footer p { font-size: 14px; line-height: 24px; color: var(--muted); margin: 24px 0 0; }
footer b { display: block; font-size: 16px; line-height: 28px; font-weight: 500; margin-bottom: 16px; color: var(--ink); }
footer > div > a:not(.logo),
footer button {
	display: block;
	min-height: 44px;
	margin: 0;
	padding: 8px 0;
	font-size: 14px;
	line-height: 24px;
	color: var(--ink);
	text-align: start;
}
footer > div > a:not(.logo):hover,
footer button:hover { color: var(--wine); text-decoration: underline; }
footer .text-btn { font-size: 14px; line-height: 24px; color: var(--ink); }
.footer-note { font-size: 14px; line-height: 24px; color: var(--wine); }
.footer-note p { margin-top: 16px; }
.copyright {
	grid-column: 1 / -1;
	font-size: 14px;
	line-height: 24px;
	color: var(--muted);
	border-top: 1px solid var(--line);
	padding-top: 24px;
}

@media (max-width: 1000px) {
	footer { gap: 32px; }
}
@media (max-width: 700px) {
	footer { grid-template-columns: 1fr 1fr; gap: 32px 16px; padding-top: 48px; }
	footer > div:first-child, .footer-note, .copyright { grid-column: 1 / -1; }
}

/* ------------------------------------------------------------------ */
/* 17. Dialogs (bag, quiz, favourites, compare), toast, mobile dock     */
/* ------------------------------------------------------------------ */
dialog {
	border: 1px solid var(--line);
	border-radius: var(--r-card);
	background: var(--paper);
	color: var(--ink);
	padding: 32px;
	width: min(560px, calc(100vw - 32px));
	max-height: 90vh;
}
dialog::backdrop { background: color-mix(in srgb, var(--ink) 40%, transparent); backdrop-filter: none; }
.compare-dialog { width: min(896px, calc(100vw - 32px)); }

.dialog-head { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-bottom: 16px; }
.dialog-head h2 { font-size: 26px; line-height: 34px; font-weight: 500; margin: 0; }
.dialog-head h2 span { color: var(--gold); }
dialog p { margin: 0 0 16px; }
.dialog-head button,
.qty button { padding: 0; }
.dialog-head button {
	width: 44px; height: 44px; min-width: 44px;
	display: inline-flex; align-items: center; justify-content: center;
	border-radius: var(--r-full); background: var(--white); border: 1px solid var(--line);
	font-size: 18px; line-height: 26px; color: var(--ink);
}

.notice {
	background: var(--blush);
	border-radius: var(--r-control);
	padding: 16px;
	font-size: 14px;
	line-height: 24px;
	color: var(--ink);
}

.cart-row {
	display: flex;
	justify-content: space-between;
	align-items: center;
	gap: 16px;
	padding: 16px 0;
	border-bottom: 1px solid var(--line);
}
.cart-row h3 { font-size: 16px; line-height: 28px; margin: 0; }
.cart-row small { font-size: 14px; line-height: 24px; color: var(--muted); }
.qty { display: flex; align-items: center; gap: 8px; white-space: nowrap; }
.qty button {
	width: 44px; height: 44px; min-width: 44px;
	border: 1px solid var(--line); background: var(--white); border-radius: var(--r-full);
	font-size: 16px; color: var(--ink);
}
.cart-total { display: flex; justify-content: space-between; margin: 24px 0 8px; font-size: 18px; line-height: 26px; font-weight: 500; }
/* Bundle discount in the popup bag */
.vlx-bag-discounts { margin: 0 0 16px; }
.cart-fee { display: flex; justify-content: space-between; gap: 16px; margin: 0 0 8px; font-size: 16px; line-height: 28px; color: var(--wine); }
.cart-fee span:last-child,
.cart-total span:last-child { white-space: nowrap; }
.vlx-bag-after { margin: 8px 0 0; padding-top: 8px; border-top: 1px solid var(--line); }
.copy-secondary { display: block; margin: 16px auto 0; }
#order-text { width: 100%; min-height: 144px; margin-top: 16px; font-size: 14px; line-height: 24px; padding: 8px; border: 1px solid var(--line); border-radius: var(--r-control); }

.quiz-options { display: grid; gap: 16px; margin-top: 16px; }
.quiz-options button {
	min-height: 48px;
	padding: 16px 24px;
	text-align: start;
	background: var(--white);
	border: 1px solid var(--line);
	border-radius: var(--r-control);
	font-size: 16px;
	line-height: 28px;
	color: var(--ink);
}
.quiz-options button:hover { background: var(--blush); }

.favorite-row { display: flex; justify-content: space-between; align-items: center; gap: 16px; padding: 16px 0; border-bottom: 1px solid var(--line); }
.favorite-row h3 { font-size: 16px; line-height: 28px; margin: 0; }
.favorite-row small { color: var(--muted); font-family: var(--font-lat); font-size: 12px; line-height: 16px; letter-spacing: .12em; text-transform: uppercase; }
.favorite-row span { color: var(--wine); font-size: 14px; }
.favorite-row > div:last-child { display: flex; gap: 8px; align-items: center; }
.favorite-row .secondary { height: 44px; min-height: 44px; padding: 0 16px; font-size: 14px; }

.table-scroll { overflow-x: auto; }
.comparison { border-collapse: collapse; width: 100%; min-width: 448px; font-size: 14px; line-height: 24px; }
.comparison td, .comparison th { border-bottom: 1px solid var(--line); padding: 16px 8px; text-align: start; vertical-align: top; }
.comparison th { color: var(--wine); font-weight: 500; }
.comparison .secondary { height: 44px; min-height: 44px; padding: 0 16px; font-size: 14px; }
.remove-compare { background: none; font-size: 18px; margin-inline-start: 8px; min-width: 44px; min-height: 44px; }

#toast {
	position: fixed;
	bottom: 24px;
	left: 50%;
	transform: translate(-50%, 32px);
	opacity: 0;
	z-index: 100;
	pointer-events: none;
	max-width: calc(100vw - 32px);
	padding: 16px 24px;
	border-radius: var(--r-control);
	background: var(--ink);
	color: var(--white);
	font-size: 14px;
	line-height: 24px;
	transition: opacity .2s, transform .2s;
}
#toast.show { opacity: 1; transform: translate(-50%, 0); }

.mobile-dock { display: none; }

@media (max-width: 700px) {
	body { padding-bottom: 64px; }
	dialog { padding: 24px 16px; }
	#toast { bottom: 88px; }
	.mobile-dock {
		position: fixed;
		inset-inline: 0;
		bottom: 0;
		z-index: 25;
		display: flex;
		justify-content: space-around;
		gap: 8px;
		margin: 0;
		padding: 8px 8px max(8px, env(safe-area-inset-bottom));
		background: var(--paper);
		border-top: 1px solid var(--line);
		backdrop-filter: none;
		font-size: 14px;
		line-height: 24px;
	}
	.mobile-dock a,
	.mobile-dock button {
		display: inline-flex;
		align-items: center;
		gap: 4px;
		min-height: 44px;
		padding: 0 8px;
		background: none;
		color: var(--ink);
		font-size: 14px;
	}
	.mobile-dock [data-count] {
		min-width: 24px; height: 24px; padding: 0 4px;
		display: inline-grid; place-items: center;
		border-radius: var(--r-full);
		background: var(--wine); color: var(--white);
		font-size: 12px; line-height: 16px;
	}
}

/* ------------------------------------------------------------------ */
/* 18. Documents (guide, how it works, contact) + native WP pages      */
/* ------------------------------------------------------------------ */
.document {
	max-width: 800px;
	min-height: 64vh;
	margin: 0 auto;
	padding: var(--section-space) var(--gutter);
}
.document h1 { font-size: 48px; line-height: 56px; margin: 16px 0 24px; letter-spacing: normal; }
.document h2 { font-size: 26px; line-height: 34px; font-weight: 500; margin: 48px 0 16px; }
.document p, .document li { color: var(--muted); font-size: 16px; line-height: 28px; }
.document ol, .document ul { padding-inline-start: 24px; }
.document .primary { margin-bottom: 24px; }
.lead { font-size: 18px; line-height: 26px; color: var(--muted); }

.contact-links { display: flex; flex-wrap: wrap; gap: 16px; margin: 32px 0; }
.contact-links a { display: inline-flex; align-items: center; min-height: 48px; padding: 0 24px; border: 1px solid var(--ink); border-radius: var(--r-control); color: var(--ink); }

.metrics { display: grid; gap: 8px; margin: 32px 0; }
.metric { display: flex; justify-content: space-between; padding: 16px; background: var(--blush); border-radius: var(--r-control); }

.policy-text { white-space: pre-line; }

.delivery-table-wrap { overflow: auto; }
.delivery-table { width: 100%; border-collapse: collapse; min-width: 544px; font-size: 14px; line-height: 24px; }
.delivery-table th, .delivery-table td { text-align: start; padding: 16px 8px; border-bottom: 1px solid var(--line); }
.delivery-table th { color: var(--wine); font-weight: 500; }

#delivery-estimate { font-size: 14px; line-height: 24px; background: var(--blush); border: 1px solid var(--line); padding: 16px; margin: 24px 0; border-radius: var(--r-control); }

.consent-options { display: flex; gap: 8px; margin-top: 24px; }
.consent-options button { flex: 1; }

@media (max-width: 700px) {
	.document h1 { font-size: 36px; line-height: 44px; }
}

.native-content {
	max-width: none;
	min-height: 56vh;
	margin: 0;
	padding-block: 48px 64px;
}
.native-content::after { content: ''; display: block; clear: both; }
.native-content h1,
.native-content .page-title,
.native-content .entry-title { font-size: 32px; line-height: 40px; font-weight: 500; letter-spacing: normal; margin: 0 0 24px; }
.native-content h2 { font-size: 26px; line-height: 34px; font-weight: 500; margin: 48px 0 16px; }
.native-content p, .native-content li { font-size: 16px; line-height: 28px; }
.native-content article img { max-width: 100%; height: auto; }

.native-content input:not([type=checkbox]):not([type=radio]):not([type=hidden]):not([type=submit]),
.native-content textarea,
.native-content select,
form label input:not([type=checkbox]),
form label select,
.woocommerce form .form-row .input-text,
.woocommerce form .form-row select {
	min-height: 48px;
	padding: 8px 16px;
	border: 1px solid var(--line);
	border-radius: var(--r-control);
	background: var(--white);
	color: var(--ink);
	font: inherit;
	font-size: 16px;
	line-height: 28px;
	max-width: 100%;
}
.native-content textarea { min-height: 144px; }

.native-content .review-notice {
	border: 1px solid var(--line);
	padding: 16px;
	background: var(--blush);
	margin-bottom: 24px;
	font-size: 14px;
	line-height: 24px;
	border-radius: var(--r-control);
}
.native-content .review-notice span { display: block; }

.empty-edit { padding: 48px 24px; text-align: center; border: 1px solid var(--line); background: var(--blush); border-radius: var(--r-card); }

.collection-search { display: flex; gap: 8px; margin-bottom: 24px; align-items: center; }
.collection-search input { flex: 1; min-width: 0; }
.collection-search label { font-size: 14px; }

.breadcrumbs { padding-block: 24px; color: var(--muted); font-size: 14px; line-height: 24px; }

@media (max-width: 700px) {
	.native-content { padding-block: 32px 48px; }
	.native-content h1,
	.native-content .page-title,
	.native-content .entry-title { font-size: 26px; line-height: 34px; }
}

/* ------------------------------------------------------------------ */
/* 19. Custom product detail layout (sites-product.php)                 */
/* ------------------------------------------------------------------ */
.product-detail { display: grid; grid-template-columns: 1fr 1fr; gap: 64px; padding-block: 16px 64px; }
.product-detail > .product-art { height: auto; border-radius: var(--r-card); }
.product-detail h1 { font-size: 36px; line-height: 44px; margin: 16px 0; letter-spacing: normal; }
.detail-price { font-size: 32px; line-height: 40px; font-weight: 500; color: var(--wine); margin: 24px 0; }
.product-detail details a { font-size: 14px; color: var(--wine); }
.detail-tools { display: flex; gap: 16px; align-items: center; justify-content: flex-end; }
dl { display: grid; grid-template-columns: 1fr 1fr; gap: 8px 16px; font-size: 14px; line-height: 24px; }
dd { margin: 0; }
.related { grid-template-columns: repeat(3, minmax(0, 1fr)); }

@media (max-width: 700px) {
	.product-detail { grid-template-columns: 1fr; gap: 32px; padding-block: 0 32px; }
	.product-detail h1 { font-size: 36px; line-height: 44px; }
	.related { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

/* ------------------------------------------------------------------ */
/* 20. WooCommerce (single product, shop loop, notices, forms, tabs)    */
/* ------------------------------------------------------------------ */
.woocommerce .woocommerce-breadcrumb { margin-bottom: 24px; font-size: 14px; line-height: 24px; color: var(--muted); }
.woocommerce .woocommerce-breadcrumb a { color: var(--muted); }

/* notices: no purple top border */
.woocommerce-error,
.woocommerce-info,
.woocommerce-message,
.wc-block-components-notice-banner {
	padding: 16px 24px;
	margin: 0 0 24px;
	background: var(--blush) !important;
	color: var(--ink) !important;
	border: 0 !important;
	border-inline-start: 2px solid var(--wine) !important;
	border-radius: var(--r-control);
	font-size: 16px;
	line-height: 28px;
}
.woocommerce-error::before,
.woocommerce-info::before,
.woocommerce-message::before { color: var(--wine); }
.woocommerce-store-notice, p.demo_store { background-color: var(--wine); color: var(--white); }

/* Shop loop as product cards */
.woocommerce ul.products { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 24px; margin: 0; padding: 0; }
.woocommerce ul.products::before,
.woocommerce ul.products::after { content: none; display: none; }
.woocommerce ul.products li.product,
.woocommerce ul.products[class*=columns-] li.product {
	width: auto !important;
	float: none !important;
	margin: 0 !important;
	display: flex;
	flex-direction: column;
	padding: 0 0 16px;
	background: var(--white);
	border: 1px solid var(--line);
	border-radius: var(--r-card);
	overflow: hidden;
	transition: box-shadow .2s;
}
@media (hover: hover) {
	.woocommerce ul.products li.product:hover { box-shadow: var(--shadow-hover); }
}
.woocommerce ul.products li.product a img {
	aspect-ratio: 4 / 5;
	width: 100%;
	object-fit: contain;
	margin: 0 0 16px;
	background: var(--blush);
	border-radius: 0;
}
.woocommerce ul.products li.product .woocommerce-loop-product__title {
	font-family: var(--font-ar);
	font-size: 18px;
	line-height: 26px;
	font-weight: 500;
	color: var(--ink);
	padding: 0;
	margin: 0 16px 8px;
}
.woocommerce ul.products li.product .price {
	margin: 0 16px 16px;
	color: var(--wine);
	font-family: var(--font-lat);
	font-size: 16px;
	line-height: 28px;
	font-weight: 500;
}
.woocommerce ul.products li.product .button { margin: auto 16px 0; }

.woocommerce .woocommerce-result-count,
.woocommerce .woocommerce-ordering { margin-bottom: 24px; font-size: 14px; line-height: 24px; color: var(--muted); }
.woocommerce .woocommerce-ordering select { min-height: 44px; padding: 0 16px; border: 1px solid var(--line); border-radius: var(--r-control); background: var(--white); }

@media (max-width: 1000px) {
	.woocommerce ul.products { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
}
@media (max-width: 700px) {
	.woocommerce ul.products { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
	.woocommerce ul.products li.product .woocommerce-loop-product__title { margin-inline: 8px; }
	.woocommerce ul.products li.product .price { margin-inline: 8px; }
	.woocommerce ul.products li.product .button { margin-inline: 8px; padding: 0 16px; font-size: 14px; }
}

/* Single product */
.woocommerce div.product div.images,
.woocommerce div.product div.summary { margin-bottom: 48px; }
.woocommerce div.product div.images img,
.woocommerce div.product .woocommerce-product-gallery__image--placeholder {
	aspect-ratio: 4 / 5;
	object-fit: contain;
	max-height: none;
	background: var(--blush);
	border-radius: var(--r-card);
}
.woocommerce div.product .product_title {
	font-size: 36px;
	line-height: 44px;
	font-weight: 500;
	margin-bottom: 16px;
	letter-spacing: normal;
}
.woocommerce div.product p.price,
.woocommerce div.product span.price,
.woocommerce ul.products li.product .price {
	color: var(--wine);
}
.woocommerce div.product p.price,
.woocommerce div.product span.price {
	font-family: var(--font-lat);
	font-size: 26px;
	line-height: 34px;
	font-weight: 500;
	margin: 0 0 24px;
}
.woocommerce .woocommerce-product-details__short-description { font-size: 16px; line-height: 28px; }
.woocommerce div.product .product_meta { font-size: 14px; line-height: 24px; color: var(--muted); }
.woocommerce div.product p.stock,
.woocommerce div.product .stock {
	display: inline-block;
	padding: 4px 8px;
	border-radius: var(--r-full);
	background: var(--blush);
	color: var(--wine) !important;
	font-size: 14px;
	line-height: 24px;
}
.woocommerce div.product form.cart { display: flex; flex-wrap: wrap; gap: 16px; align-items: center; margin: 0 0 32px; }
.woocommerce div.product form.cart div.quantity { margin: 0; float: none; }
.woocommerce .quantity .qty {
	width: 96px;
	min-height: 48px;
	padding: 8px !important;
	border: 1px solid var(--line);
	border-radius: var(--r-control);
	font-size: 16px;
}

.woocommerce div.product .woocommerce-tabs ul.tabs { padding: 0; margin: 0 0 24px; }
.woocommerce div.product .woocommerce-tabs ul.tabs::before { border-color: var(--line); }
.woocommerce div.product .woocommerce-tabs ul.tabs li {
	background: var(--paper);
	border-color: var(--line);
	border-radius: var(--r-control) var(--r-control) 0 0;
	margin: 0 0 0 8px;
	padding: 0 16px;
}
.woocommerce div.product .woocommerce-tabs ul.tabs li::before,
.woocommerce div.product .woocommerce-tabs ul.tabs li::after { display: none; }
.woocommerce div.product .woocommerce-tabs ul.tabs li a { font-size: 16px; line-height: 28px; padding: 8px 0; color: var(--muted); font-weight: 500; }
.woocommerce div.product .woocommerce-tabs ul.tabs li.active { background: var(--white); border-bottom-color: var(--white); }
.woocommerce div.product .woocommerce-tabs ul.tabs li.active a { color: var(--ink); }
.woocommerce div.product .woocommerce-tabs .panel { padding: 24px 0; font-size: 16px; line-height: 28px; }
.woocommerce .woocommerce-tabs a { text-decoration: underline; }
.woocommerce table.shop_attributes,
.woocommerce table.shop_table { border-color: var(--line); }
.woocommerce table.shop_attributes th,
.woocommerce table.shop_attributes td { border-color: var(--line); padding: 8px 16px; font-size: 14px; line-height: 24px; }
.woocommerce table.shop_attributes tr:nth-child(even) th,
.woocommerce table.shop_attributes tr:nth-child(even) td { background: var(--paper); }

.woocommerce #reviews #comments h2,
.woocommerce #review_form #respond .comment-reply-title { font-size: 18px; line-height: 26px; font-weight: 500; }
.woocommerce #review_form #respond p { font-size: 14px; line-height: 24px; }
.woocommerce .star-rating span::before,
.woocommerce p.stars a { color: var(--wine); }

.reference-caption { font-size: 14px !important; line-height: 24px; color: var(--muted); text-align: center; margin: 8px 0 !important; }

/* Forms */
.woocommerce form .form-row { padding: 8px 0; margin: 0 0 8px; }
.woocommerce form .form-row label { margin-bottom: 8px; font-size: 14px; line-height: 24px; }
.woocommerce form .form-row .required { color: var(--wine); }
.woocommerce form.checkout_coupon,
.woocommerce form.login,
.woocommerce form.register,
.woocommerce-form-track-order {
	border: 1px solid var(--line);
	border-radius: var(--r-card);
	padding: 24px;
	margin: 24px 0;
	background: var(--white);
}

/* My account */
.woocommerce .woocommerce-MyAccount-navigation,
.native-content .woocommerce-MyAccount-navigation { display: block; width: 25%; }
.woocommerce .woocommerce-MyAccount-navigation ul { list-style: none; padding: 0; margin: 0; }
.woocommerce .woocommerce-MyAccount-navigation li { border-bottom: 1px solid var(--line); padding: 0; }
.woocommerce .woocommerce-MyAccount-navigation li a { display: block; padding: 16px 0; color: var(--ink); }
.woocommerce .woocommerce-MyAccount-navigation li.is-active a { color: var(--wine); font-weight: 500; }
.woocommerce .woocommerce-MyAccount-content { width: 70%; }
@media (max-width: 700px) {
	.woocommerce .woocommerce-MyAccount-navigation,
	.woocommerce .woocommerce-MyAccount-content { width: 100%; float: none; }
}

.woocommerce-cart table.cart img { width: 64px; }

/* Price filter widget (purple by default) */
.woocommerce .widget_price_filter .ui-slider .ui-slider-handle,
.woocommerce .widget_price_filter .ui-slider .ui-slider-range { background-color: var(--wine); }
.woocommerce span.onsale {
	background: var(--blush);
	color: var(--wine);
	border-radius: var(--r-full);
	min-height: 0;
	min-width: 0;
	padding: 4px 8px;
	font-size: 14px;
	line-height: 24px;
	font-weight: 500;
}

/* ------------------------------------------------------------------ */
/* 21. WooCommerce Blocks (cart + checkout)                            */
/* ------------------------------------------------------------------ */
.wc-block-cart,
.wc-block-checkout,
.wp-block-woocommerce-cart,
.wp-block-woocommerce-checkout {
	font-family: var(--font-ar);
	color: var(--ink);
}
/* Small block texts: WooCommerce uses .8125em (13px); Arabic floor is 14px */
.wc-block-components-address-card,
.wc-block-components-address-card__address-section,
.wc-block-components-address-card__edit,
.wc-blocks-components-select__label,
.wc-block-components-address-form__address_2-toggle,
.wc-block-components-text-input label,
.wc-block-components-text-input.is-active label,
.wc-block-components-combobox .wc-block-components-combobox-control label,
.wc-block-components-checkbox__label,
.wc-block-components-checkout-step__description,
.wc-block-components-totals-item__description,
.wc-block-components-validation-error,
.wc-block-components-validation-error > p,
.wc-block-components-product-details,
.wc-block-components-product-metadata,
.wc-block-components-product-metadata__description,
.wc-block-components-order-summary-item__quantity,
.wc-block-components-radio-control__description,
.wc-block-components-radio-control__secondary-label,
.wc-block-components-radio-control__secondary-description,
.wc-block-components-shipping-rates-control__package-items,
.wc-block-components-totals-coupon-link,
.wc-block-components-panel__button,
.wc-block-checkout__terms,
.wc-block-checkout__guest-checkout-notice,
.wc-block-checkout__login-prompt,
.wc-block-components-checkout-return-to-cart-button,
.wc-block-components-notice-banner__content,
.wc-block-components-formatted-money-amount,
.wc-block-components-product-price,
.wc-block-cart-item__remove-link,
.wc-block-cart-items__header,
.wc-block-cart-items__header span,
.wc-block-components-product-metadata__description p,
.wc-block-components-product-details li,
.wc-block-components-totals-item__label,
.wc-block-components-totals-item__value,
.wc-block-components-radio-control__label,
.wc-block-components-radio-control__label-group,
.wc-block-components-payment-method-label,
.wc-block-components-radio-control-accordion-content,
.wc-block-components-radio-control-accordion-content p,
.wc-block-components-shipping-rates-control__no-results-notice,
.wc-block-components-order-summary-item__description,
.wc-block-components-order-summary-item__description p {
	font-size: 14px !important;
	line-height: 24px !important;
}
.wc-block-components-text-input.is-active label,
.wc-block-components-combobox .wc-block-components-combobox-control.is-active label { transform: translateY(4px) scale(1) !important; }
.wc-block-components-text-input input,
.wc-block-components-combobox .wc-block-components-combobox-control input { padding-top: 24px !important; }

.wc-block-components-title,
.wc-block-cart__totals-title,
.wc-block-components-checkout-step__title {
	font-size: 18px !important;
	line-height: 26px !important;
	font-weight: 500 !important;
}
.wc-block-components-text-input input,
.wc-block-components-combobox .wc-block-components-combobox-control input,
.wc-blocks-components-select .wc-blocks-components-select__select,
.wc-block-components-textarea {
	border-color: var(--line) !important;
	border-radius: var(--r-control) !important;
	background: var(--white) !important;
	color: var(--ink) !important;
	font-size: 16px !important;
}
.wc-block-components-text-input.is-active input,
.wc-block-components-text-input input:focus,
.wc-blocks-components-select .wc-blocks-components-select__select:focus {
	border-color: var(--wine) !important;
	box-shadow: 0 0 0 1px var(--wine) !important;
}
.wc-block-components-radio-control__input:checked { border-color: var(--wine) !important; }
.wc-block-components-radio-control__input:checked::before { background: var(--wine) !important; }
.wc-block-components-checkbox .wc-block-components-checkbox__input[type=checkbox]:checked { background: var(--wine) !important; border-color: var(--wine) !important; }
.wc-block-components-checkbox .wc-block-components-checkbox__mark { fill: var(--white) !important; }
.wc-block-components-totals-item__value,
.wc-block-components-product-price,
.wc-block-formatted-money-amount { font-family: var(--font-lat); }
.wc-block-components-totals-footer-item .wc-block-components-totals-item__value,
.wc-block-components-totals-footer-item .wc-block-components-totals-item__label { font-size: 18px !important; line-height: 26px !important; font-weight: 500 !important; color: var(--ink); }
.wc-block-components-product-name { color: var(--ink) !important; font-size: 16px !important; line-height: 28px !important; }
.wc-block-components-product-metadata { font-size: 14px !important; line-height: 24px !important; color: var(--muted); }
.wc-block-components-sidebar-layout .wc-block-components-main,
.wc-block-components-sidebar { padding-inline: 0; }
.wc-block-components-panel,
.wc-block-components-totals-wrapper { border-color: var(--line) !important; }
.wc-block-components-quantity-selector { border-color: var(--line) !important; border-radius: var(--r-control) !important; }
.wc-block-components-quantity-selector__button { min-width: 44px; min-height: 44px; color: var(--ink) !important; }
.wc-block-cart-item__remove-link,
.wc-block-components-button.is-link { color: var(--wine) !important; font-size: 14px !important; }
.wc-block-cart-item__remove-link { min-width: 44px; min-height: 44px; display: inline-flex !important; align-items: center; justify-content: center; }
.wc-block-components-checkout-place-order-button,
.wc-block-cart__submit-button { width: 100%; }

.wc-block-grid__product {
	background: var(--white);
	border: 1px solid var(--line) !important;
	border-radius: var(--r-card);
	padding: 0 0 16px !important;
	overflow: hidden;
}
.wc-block-grid__product-image img { aspect-ratio: 4 / 5; object-fit: contain; background: var(--blush); }
.wc-block-grid__product-title { font-size: 16px !important; line-height: 28px !important; font-weight: 500 !important; color: var(--ink) !important; padding: 0 16px; }
.wc-block-grid__product-title { margin: 0 0 8px !important; }
.wc-block-grid__product-price { color: var(--wine) !important; font-family: var(--font-lat); font-size: 16px !important; line-height: 28px !important; font-weight: 500; padding: 0 16px; margin: 0 0 16px !important; }

/* Empty-cart suggestions (WP block buttons): secondary style, several per row */
.wc-block-grid__product-image { margin: 0 0 16px !important; }
.wc-block-grid__product-add-to-cart.wp-block-button { margin: 0 16px; }
.wc-block-grid__product-add-to-cart .wp-block-button__link,
.wp-block-button__link.add_to_cart_button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 48px;
	padding: 0 16px !important;
	background: transparent !important;
	color: var(--ink) !important;
	border: 1px solid var(--ink) !important;
	border-radius: var(--r-control) !important;
	font-family: var(--font-ar);
	font-size: 16px !important;
	line-height: 24px;
	font-weight: 500;
}
.woocommerce-Price-currencySymbol { font-family: var(--font-ar); font-size: inherit !important; }
.wc-block-components-notice-banner { gap: 8px !important; }
.wc-block-components-notice-banner .wc-block-components-button { margin: 0 !important; }
.woocommerce-placeholder,
.woocommerce ul.products li.product a img.woocommerce-placeholder,
.woocommerce-product-gallery__image--placeholder { border: 0 !important; }

/* Lists inside page content */
.native-content ul,
.native-content ol { padding-inline-start: 24px; margin: 0 0 16px; }

/* Checkout journey + notes printed by the parent theme
   (their inline CSS was attached to the parent stylesheet, now replaced) */
.vlx-checkout-journey { margin: 0 0 24px; direction: rtl; }
.vlx-checkout-journey ol {
	list-style: none;
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 8px;
	padding: 0;
	margin: 0;
}
.vlx-checkout-journey li {
	display: flex;
	align-items: center;
	gap: 8px;
	min-height: 48px;
	padding: 8px 16px;
	border: 1px solid var(--line);
	border-radius: var(--r-control);
	background: var(--white);
	color: var(--ink);
	font-size: 14px;
	line-height: 24px;
}
.vlx-checkout-journey li[aria-current=step] { background: var(--ink); border-color: var(--ink); color: var(--white); }
.vlx-checkout-journey li span {
	display: grid;
	place-items: center;
	flex: none;
	width: 24px;
	height: 24px;
	border: 1px solid currentColor;
	border-radius: var(--r-full);
	font-family: var(--font-lat);
	font-size: 12px;
	line-height: 16px;
}
.vlx-checkout-journey a { color: inherit; text-decoration: underline; text-underline-offset: 4px; }
.vlx-checkout-note {
	background: var(--blush);
	border-inline-start: 2px solid var(--gold);
	border-radius: var(--r-control);
	padding: 16px;
	font-size: 14px;
	line-height: 24px;
	margin: 0 0 24px;
	color: var(--ink);
}
.vlx-checkout-track { margin-block: 16px; }
@media (max-width: 420px) {
	.vlx-checkout-journey li { flex-direction: column; text-align: center; padding: 8px; }
}

/* Cart suggestions: plain section with cards (no card inside a card) */
#vlx-cart-suggestions { margin-block: 32px; padding: 0; background: none; border: 0; }
#vlx-cart-suggestions [hidden],
#vlx-cart-suggestions[hidden] { display: none; }
#vlx-cart-suggestions h2 { font-size: 26px; line-height: 34px; margin: 0 0 24px; }
.vlx-suggestion-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 256px), 1fr)); gap: 16px; }
.vlx-suggestion-grid article {
	padding: 24px;
	background: var(--white);
	border: 1px solid var(--line);
	border-radius: var(--r-card);
}
.vlx-suggestion-grid h3 { font-size: 18px; line-height: 26px; margin: 0 0 8px; }
.vlx-suggestion-grid p { font-size: 14px; line-height: 24px; color: var(--muted); margin: 0 0 16px; }
.vlx-suggestion-grid .price, .vlx-suggestion-grid .amount { color: var(--wine); font-weight: 500; }

/* ------------------------------------------------------------------ */
/* 22. Back-in-stock notification form (plugin markup)                 */
/* ------------------------------------------------------------------ */
.vlx-stock-notice { margin: 24px 0; padding: 24px; border: 1px solid var(--line); border-radius: var(--r-card); background: var(--white); }
.cwginstock-subscribe-form { max-width: 100%; direction: rtl; }
.cwginstock-subscribe-form .panel-primary { border-color: var(--line) !important; border-radius: var(--r-card); }
.cwginstock-subscribe-form .panel-heading { background: var(--wine) !important; border-color: var(--wine) !important; color: var(--white); }
.cwginstock-panel-heading h4 { color: var(--white); font-size: 18px; line-height: 26px; }
.cwginstock-subscribe-form input[type=email],
.cwginstock-subscribe-form input[type=text] {
	width: 100%;
	min-height: 48px;
	border: 1px solid var(--line);
	border-radius: var(--r-control);
	padding: 8px 16px;
	font-size: 16px;
}
.cwginstock-subscribe-form label { font-size: 14px; line-height: 24px; }
.cwgstock_button { background: var(--wine) !important; color: var(--white) !important; }

/* ------------------------------------------------------------------ */
/* 23. TranslatePress floating switcher                                */
/* ------------------------------------------------------------------ */
.trp-language-switcher.trp-floating-switcher {
	--bg: var(--white);
	--bg-hover: var(--blush);
	--text: var(--ink);
	--text-hover: var(--wine);
	--border: 1px solid var(--line);
	--border-radius: 8px 8px 0 0;
	--font-size: 14px;
}
@media (max-width: 700px) {
	.trp-language-switcher.trp-floating-switcher { bottom: 64px !important; }
}

/* ------------------------------------------------------------------ */
/* 24. Motion preferences                                              */
/* ------------------------------------------------------------------ */
@media (prefers-reduced-motion: reduce) {
	html { scroll-behavior: auto; }
	*, *::before, *::after { transition: none !important; animation: none !important; }
}

/* Header icons on phones: account, language and bag fit beside the logo
   (the search link is hidden; the collection has its own search box). */
@media (max-width: 700px) {
	header .nav-actions { gap: 4px; }
	header .nav-actions .search-link { display: none; }
	header .nav-actions .lang-switch { padding: 0 8px; }
}

/* Glow Club teaser on the home page */
.glow-teaser {
	position: relative;
	overflow: hidden;
	display: grid;
	grid-template-columns: 1.1fr 1fr;
	gap: 32px;
	align-items: center;
	max-width: var(--container);
	margin: 0 auto var(--section-space);
	margin-inline: max(var(--gutter), calc((100% - var(--container)) / 2));
	padding: 48px;
	border-radius: 32px;
	border: 1px solid rgba(255, 255, 255, .9);
	background:
		radial-gradient(50% 70% at 90% 10%, rgba(255, 255, 255, .85), transparent 60%),
		radial-gradient(60% 80% at 0% 100%, rgba(214, 150, 190, .5), transparent 60%),
		linear-gradient(160deg, #FAE9F1, #EBC9DC);
	box-shadow: 0 24px 60px rgba(63, 29, 52, .14), inset 0 1px 0 #FFFFFF;
}
.glow-teaser h2 { margin: 8px 0 16px; color: var(--ink); }
.glow-teaser p { margin: 0 0 24px; color: var(--ink); }
.glow-teaser-perks { display: grid; gap: 16px; }
.glow-teaser-perks div {
	display: flex;
	align-items: baseline;
	gap: 16px;
	padding: 16px 24px;
	border-radius: 16px;
	background: rgba(255, 255, 255, .6);
	border: 1px solid rgba(255, 255, 255, .95);
	-webkit-backdrop-filter: blur(10px);
	backdrop-filter: blur(10px);
}
.glow-teaser-perks b { min-width: 72px; font-family: var(--font-lat); font-size: 32px; line-height: 40px; font-weight: 500; color: var(--wine); }
.glow-teaser-perks span { color: var(--ink); }
.glow-teaser-spark { position: absolute; inset-inline-start: 24px; top: 16px; font-size: 48px; line-height: 56px; color: #FFFFFF; opacity: .8; }
@media (max-width: 800px) {
	.glow-teaser { grid-template-columns: 1fr; padding: 32px 24px; border-radius: 24px; }
}

/* ------------------------------------------------------------------ */
/* One curve for the whole store (1.7.0)                               */
/*   buttons  → full pill · fields → 14px · boxes and cards → 16px      */
/* ------------------------------------------------------------------ */
:root {
	--r-control: 14px;
	--r-card: 16px;
	--wc-form-border-radius: 14px;
}
.quiz-options button,
.contact-links a,
.wp-block-button__link,
.wp-element-button,
.wp-block-button__link.add_to_cart_button,
.single_add_to_cart_button,
.wc-block-cart__submit-button,
.wc-block-components-checkout-place-order-button,
.wc-block-components-button:not(.is-link),
.cwginstock-subscribe-form input[type=submit],
.woocommerce .button,
.woocommerce-button,
button.button,
a.button,
input[type=submit],
input[type=button] {
	border-radius: var(--r-full) !important;
}
#collection .search-box { border-radius: var(--r-full); }
.cwginstock-subscribe-form input[type=text],
.woocommerce form .form-row :is(input.input-text, select, textarea),
.wc-block-components-text-input input,
.wc-block-components-textarea,
.woocommerce .quantity .qty { border-radius: var(--r-control) !important; }

/* ------------------------------------------------------------------ */
/* Mobile hamburger menu                                               */
/* ------------------------------------------------------------------ */
.menu-toggle, header nav .nav-extra { display: none; }
@media (max-width: 700px) {
	header .nav-actions .menu-toggle {
		order: -1;
		position: relative;
		display: inline-flex;
		align-items: center;
		justify-content: center;
		width: 44px;
		height: 44px;
		padding: 0;
		color: var(--wine);
		background: var(--white);
		border: 1px solid var(--line);
		border-radius: var(--r-full);
		cursor: pointer;
	}
	.menu-bars { position: relative; width: 18px; height: 12px; }
	.menu-bars i {
		position: absolute;
		inset-inline: 0;
		height: 1.6px;
		border-radius: 2px;
		background: currentColor;
		transition: transform .2s ease, opacity .2s ease, top .2s ease;
	}
	.menu-bars i:nth-child(1) { top: 0; }
	.menu-bars i:nth-child(2) { top: 5px; }
	.menu-bars i:nth-child(3) { top: 10px; }
	header.nav-open .menu-bars i:nth-child(1) { top: 5px; transform: rotate(45deg); }
	header.nav-open .menu-bars i:nth-child(2) { opacity: 0; }
	header.nav-open .menu-bars i:nth-child(3) { top: 5px; transform: rotate(-45deg); }

	header nav#site-nav { display: none; }
	header.nav-open nav#site-nav {
		position: absolute;
		top: calc(100% + 8px);
		inset-inline: 16px;
		z-index: 60;
		display: flex;
		flex-direction: column;
		gap: 0;
		width: auto;
		padding: 8px;
		border: 1px solid rgba(255, 255, 255, .9);
		border-radius: 24px;
		background: linear-gradient(165deg, rgba(251, 238, 245, .92), rgba(236, 200, 221, .9));
		-webkit-backdrop-filter: blur(18px) saturate(1.3);
		backdrop-filter: blur(18px) saturate(1.3);
		box-shadow: 0 24px 60px rgba(63, 29, 52, .22), inset 0 1px 0 #FFFFFF;
		animation: vlx-menu-in .18s ease-out;
	}
	header.nav-open nav#site-nav a {
		display: flex;
		align-items: center;
		min-height: 52px;
		padding: 0 16px;
		border-radius: 16px;
		font-size: 16px;
		line-height: 24px;
		color: var(--ink);
	}
	header.nav-open nav#site-nav a:hover,
	header.nav-open nav#site-nav a:focus-visible { background: rgba(255, 255, 255, .7); color: var(--wine); }
	header.nav-open nav#site-nav a + a { border-top: 1px solid rgba(255, 255, 255, .7); }
	header nav .nav-extra { color: var(--wine) !important; }
	header.nav-open nav#site-nav .nav-extra { display: flex; }
	@keyframes vlx-menu-in { from { opacity: 0; transform: translateY(-6px); } to { opacity: 1; transform: none; } }
}
@media (prefers-reduced-motion: reduce) {
	header.nav-open nav#site-nav { animation: none; }
}
@media (max-width: 700px) {
	header { gap: 8px; }
	header .vlx-refined-brand { width: 124px; height: 62px; }
}
@media (max-width: 360px) {
	header .vlx-refined-brand { width: 104px; height: 52px; }
	header .nav-actions .lang-switch span { display: none; }
}
/* Phones: logo and icons always stay on one row; the logo gives way first */
@media (max-width: 700px) {
	header { flex-wrap: nowrap; }
	header .brand-logo { flex: 0 1 124px; min-width: 96px; }
	header .vlx-refined-brand { width: 100%; max-width: 124px; height: auto; }
	header .nav-actions { flex: none; }
}
@media (max-width: 374px) {
	header .nav-actions .lang-switch span { display: none; }
	header .nav-actions .lang-switch { padding: 0; width: 44px; justify-content: center; }
}

/* ------------------------------------------------------------------ */
/* My Account (1.8.0): glass navigation, greeting and quick tiles      */
/* ------------------------------------------------------------------ */
.woocommerce-account .native-content > h1 { margin-bottom: 32px; }
.woocommerce-account .woocommerce {
	display: grid;
	grid-template-columns: 280px minmax(0, 1fr);
	gap: 32px;
	align-items: start;
}
.woocommerce-account .woocommerce::before,
.woocommerce-account .woocommerce::after { display: none; }
.woocommerce-account .woocommerce > .woocommerce-notices-wrapper { grid-column: 1 / -1; }
.woocommerce-account .woocommerce-MyAccount-navigation,
.woocommerce-account .woocommerce-MyAccount-content { float: none; width: auto; margin: 0; }
.woocommerce-MyAccount-navigation {
	position: sticky;
	top: 128px;
	padding: 12px;
	border: 1px solid rgba(255, 255, 255, .9);
	border-radius: 24px;
	background: linear-gradient(165deg, rgba(251, 238, 245, .9), rgba(236, 200, 221, .75));
	box-shadow: 0 16px 40px rgba(63, 29, 52, .10), inset 0 1px 0 #FFFFFF;
}
.woocommerce-MyAccount-navigation ul { display: grid; gap: 4px; margin: 0; padding: 0; list-style: none; }
.woocommerce-MyAccount-navigation li { margin: 0; padding: 0; border: 0 !important; }
.woocommerce-MyAccount-navigation li a {
	display: flex;
	align-items: center;
	min-height: 48px;
	padding: 0 16px;
	border-radius: var(--r-full);
	color: var(--ink);
	font-size: 16px;
	line-height: 24px;
	text-decoration: none;
	transition: background .15s ease, color .15s ease;
}
.woocommerce-MyAccount-navigation li a:hover { background: rgba(255, 255, 255, .75); color: var(--wine); }
.woocommerce-MyAccount-navigation li.is-active a {
	background: var(--wine);
	color: var(--white);
	box-shadow: 0 8px 18px rgba(147, 64, 111, .28);
}
.woocommerce-MyAccount-navigation-link--customer-logout { margin-top: 8px !important; padding-top: 8px !important; border-top: 1px solid rgba(255, 255, 255, .8) !important; }
.woocommerce-MyAccount-navigation-link--customer-logout a { color: var(--muted); font-size: 14px; }
.woocommerce-MyAccount-content { min-width: 0; }
.woocommerce-MyAccount-content > p:first-child { margin-top: 0; }

.vlx-acc-hello { margin: 0 0 24px; }
.vlx-acc-hello h2 { margin: 8px 0; color: var(--ink); }
.vlx-acc-hello p { margin: 0; color: var(--muted); }
.vlx-acc-tiles { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; margin: 0 0 24px; }
.vlx-acc-tile {
	display: grid;
	gap: 4px;
	align-content: start;
	min-height: 132px;
	padding: 20px;
	border: 1px solid var(--line);
	border-radius: var(--r-card);
	background: var(--white);
	color: var(--ink);
	text-decoration: none;
	transition: transform .15s ease, box-shadow .15s ease, border-color .15s ease;
}
.vlx-acc-tile:hover { transform: translateY(-2px); border-color: var(--gold); box-shadow: var(--shadow-hover); }
.vlx-acc-tile svg { color: var(--wine); margin-bottom: 4px; }
.vlx-acc-tile-title { font-size: 16px; line-height: 24px; font-weight: 500; }
.vlx-acc-tile b { font-family: var(--font-lat); font-size: 28px; line-height: 36px; font-weight: 500; color: var(--wine); }
.vlx-acc-tile small { font-size: 14px; line-height: 20px; color: var(--muted); }
.woocommerce-MyAccount-content .vlx-glow-card { margin-top: 0; }

/* Orders and addresses tables inside the account */
.woocommerce-account table.shop_table { border: 1px solid var(--line); border-radius: var(--r-card); overflow: hidden; border-collapse: separate; border-spacing: 0; background: var(--white); }
.woocommerce-account table.shop_table :is(th, td) { padding: 16px; text-align: start; }
.woocommerce-account .woocommerce-Addresses { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 16px; }
.woocommerce-account .woocommerce-Address { padding: 20px; border: 1px solid var(--line); border-radius: var(--r-card); background: var(--white); width: auto !important; float: none !important; }
.woocommerce-account .woocommerce-Addresses::before, .woocommerce-account .woocommerce-Addresses::after { display: none; }

/* Sign-in / create account */
.woocommerce-account:not(.logged-in) .woocommerce { display: block; }
.woocommerce-account #customer_login { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px; }
.woocommerce-account #customer_login::before, .woocommerce-account #customer_login::after { display: none; }
.woocommerce-account #customer_login > div { float: none; width: auto; padding: 32px; border: 1px solid rgba(255, 255, 255, .9); border-radius: 24px; background: linear-gradient(165deg, rgba(251, 238, 245, .9), rgba(236, 200, 221, .7)); box-shadow: 0 16px 40px rgba(63, 29, 52, .10), inset 0 1px 0 #FFFFFF; }
.woocommerce-account #customer_login form.login,
.woocommerce-account #customer_login form.register { margin: 0; padding: 0; border: 0; background: none; }

@media (max-width: 900px) {
	.vlx-acc-tiles { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 800px) {
	.woocommerce-account .woocommerce { grid-template-columns: 1fr; gap: 24px; }
	.woocommerce-MyAccount-navigation { position: static; padding: 8px; border-radius: 20px; }
	.woocommerce-MyAccount-navigation ul { display: flex; overflow-x: auto; gap: 4px; scrollbar-width: none; }
	.woocommerce-MyAccount-navigation li { flex: none; }
	.woocommerce-MyAccount-navigation li a { min-height: 44px; white-space: nowrap; font-size: 14px; }
	.woocommerce-MyAccount-navigation-link--customer-logout { margin: 0 !important; padding: 0 !important; border: 0 !important; }
	.woocommerce-account #customer_login { grid-template-columns: 1fr; }
	.woocommerce-account #customer_login > div { padding: 24px; }
}
@media (max-width: 420px) {
	.vlx-acc-tile { min-height: 116px; padding: 16px; }
}
/* Account navigation: win over the older .woocommerce rules (1.8.1) */
.woocommerce .woocommerce-MyAccount-navigation li a { display: flex; padding: 0 16px; color: var(--ink); }
.woocommerce .woocommerce-MyAccount-navigation li.is-active a { color: var(--white); font-weight: 500; }
.woocommerce .woocommerce-MyAccount-navigation li.is-active a:hover { color: var(--white); background: var(--wine-hover); }
.woocommerce .woocommerce-MyAccount-navigation-link--customer-logout a { color: var(--muted); }

/* ------------------------------------------------------------------ */
/* Header tools 1.9.0: one glass capsule (search · account · language) */
/* beside a featured bag; expanding search with live results           */
/* ------------------------------------------------------------------ */
header .nav-actions { gap: 12px; }
.hdr-tools {
	display: flex;
	align-items: center;
	gap: 2px;
	height: 50px;
	padding: 3px;
	border: 1px solid rgba(255, 255, 255, .95);
	border-radius: var(--r-full);
	background: linear-gradient(180deg, rgba(255, 255, 255, .92), rgba(246, 227, 236, .72));
	box-shadow: 0 8px 22px rgba(63, 29, 52, .08), inset 0 1px 0 #FFFFFF, inset 0 0 0 1px rgba(235, 210, 223, .45);
}
header .hdr-tools :is(.account-link, .lang-switch, .search-toggle) {
	position: relative;
	width: 42px;
	min-width: 42px;
	height: 42px;
	min-height: 42px;
	padding: 0;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 4px;
	border: 0;
	border-radius: var(--r-full);
	background: transparent;
	color: var(--ink);
	cursor: pointer;
	transition: background .2s ease, color .2s ease, box-shadow .2s ease;
}
header .hdr-tools .lang-switch { width: auto; padding: 0 12px; }
header .hdr-tools :is(.account-link, .lang-switch, .search-toggle):hover,
header .hdr-tools :is(.account-link, .lang-switch, .search-toggle):focus-visible {
	background: #FFFFFF;
	color: var(--wine);
	box-shadow: 0 4px 12px rgba(147, 64, 111, .14);
}
/* hairline dividers between the capsule items */
header .hdr-tools :is(.account-link, .lang-switch)::before {
	content: "";
	position: absolute;
	inset-inline-start: -2px;
	top: 12px;
	bottom: 12px;
	width: 1px;
	background: linear-gradient(180deg, transparent, var(--line), transparent);
}
header .hdr-tools :is(.account-link, .lang-switch):hover::before { opacity: 0; }

/* Featured bag */
header .nav-actions .bag {
	width: 50px;
	height: 50px;
	min-width: 50px;
	min-height: 50px;
	color: #FFFFFF;
	border: 0;
	background: linear-gradient(160deg, #A9548A, var(--wine) 55%, #7C3159);
	box-shadow: 0 10px 22px rgba(147, 64, 111, .32), inset 0 1px 0 rgba(255, 255, 255, .35);
	transition: transform .2s ease, box-shadow .2s ease;
}
header .nav-actions .bag:hover { background: linear-gradient(160deg, #B5649A, var(--wine) 55%, #722B51); transform: translateY(-2px); box-shadow: 0 14px 28px rgba(147, 64, 111, .38), inset 0 1px 0 rgba(255, 255, 255, .35); }
header .nav-actions .bag .vlx-bag-icon path[stroke]:not([stroke="currentColor"]) { stroke: #F3C7DE; }
header .bag [data-count] {
	background: #FFFFFF;
	color: var(--wine);
	border: 0;
	box-shadow: 0 2px 8px rgba(63, 29, 52, .25);
	font-weight: 600;
}

/* Expanding search */
.hdr-search { position: relative; display: flex; align-items: center; }
.hdr-search-form {
	width: 0;
	opacity: 0;
	overflow: hidden;
	transition: width .42s cubic-bezier(.2, .8, .2, 1), opacity .25s ease;
}
.hdr-search.is-open .hdr-search-form { width: 250px; opacity: 1; }
.hdr-search-input {
	width: 100%;
	height: 42px;
	padding: 0 16px !important;
	border: 0 !important;
	background: transparent !important;
	box-shadow: none !important;
	color: var(--ink);
	font: inherit;
	font-size: 15px;
	outline: none;
}
.hdr-search-input::placeholder { color: var(--muted); }
.hdr-search-input::-webkit-search-cancel-button { display: none; }
.hdr-search .i-close { display: none; }
.hdr-search.is-open .i-search { display: none; }
.hdr-search.is-open .i-close { display: block; }
.hdr-search.is-open .search-toggle { background: #FFFFFF; color: var(--wine); }
header.search-open nav#site-nav { opacity: .35; transition: opacity .3s ease; }
.screen-reader-text { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }

.hdr-search-results {
	position: absolute;
	top: calc(100% + 14px);
	inset-inline-end: -4px;
	z-index: 70;
	width: 360px;
	max-height: min(70vh, 480px);
	overflow-y: auto;
	padding: 8px;
	border: 1px solid rgba(255, 255, 255, .95);
	border-radius: 24px;
	background: linear-gradient(165deg, rgba(252, 241, 247, .97), rgba(240, 214, 229, .95));
	-webkit-backdrop-filter: blur(18px) saturate(1.3);
	backdrop-filter: blur(18px) saturate(1.3);
	box-shadow: 0 24px 60px rgba(63, 29, 52, .2), inset 0 1px 0 #FFFFFF;
	animation: hdr-pop .2s ease-out;
}
.hdr-search-results a {
	display: grid;
	grid-template-columns: 52px 1fr;
	gap: 12px;
	align-items: center;
	padding: 8px;
	border-radius: 16px;
	color: var(--ink);
	text-decoration: none;
}
.hdr-search-results a:hover,
.hdr-search-results a[aria-selected="true"] { background: rgba(255, 255, 255, .85); }
.hdr-search-results img { width: 52px; height: 52px; border-radius: 12px; object-fit: cover; background: var(--blush); }
.hdr-search-results b { display: block; font-size: 14px; line-height: 20px; font-weight: 500; }
.hdr-search-results small { font-family: var(--font-lat); font-size: 13px; color: var(--wine); }
.hdr-search-results mark { background: rgba(194, 127, 164, .25); color: inherit; border-radius: 4px; padding: 0 2px; }
.hdr-search-results a.hdr-all { display: flex; justify-content: center; margin-top: 4px; min-height: 44px; color: var(--wine); font-weight: 500; border-top: 1px solid rgba(255, 255, 255, .8); border-radius: 0 0 16px 16px; }
.hdr-search-results .hdr-empty { padding: 16px; margin: 0; text-align: center; color: var(--muted); font-size: 14px; }
@keyframes hdr-pop { from { opacity: 0; transform: translateY(-6px) scale(.98); } to { opacity: 1; transform: none; } }

/* Less space between the header and the hero */
.hero { padding-block: 40px var(--section-space); }

@media (max-width: 700px) {
	header .nav-actions { gap: 6px; }
	.hdr-tools { height: 46px; padding: 2px; }
	header .hdr-tools :is(.account-link, .lang-switch, .search-toggle) { width: 40px; min-width: 40px; height: 40px; min-height: 40px; }
	header .hdr-tools .lang-switch { width: auto; padding: 0 8px; }
	header .nav-actions .bag { width: 46px; height: 46px; min-width: 46px; min-height: 46px; }
	.hdr-search { position: static; }
	.hdr-search-form {
		position: absolute;
		top: calc(100% + 8px);
		inset-inline: 16px;
		z-index: 70;
		width: auto !important;
		height: 0;
		border-radius: var(--r-full);
		background: rgba(255, 255, 255, .97);
		box-shadow: 0 16px 40px rgba(63, 29, 52, .18), inset 0 0 0 1px rgba(235, 210, 223, .8);
		transition: height .3s cubic-bezier(.2, .8, .2, 1), opacity .2s ease;
	}
	.hdr-search.is-open .hdr-search-form { height: 52px; }
	.hdr-search-input { height: 52px; font-size: 16px; }
	.hdr-search-results { top: calc(100% + 68px); inset-inline: 16px; width: auto; }
	header.search-open nav#site-nav { opacity: 1; }
	.hero { padding-block: 24px var(--section-space); }
}
@media (max-width: 400px) {
	header .hdr-tools .lang-switch span { display: none; }
	header .hdr-tools .lang-switch { padding: 0; width: 40px; }
}

/* ------------------------------------------------------------------ */
/* Back to top: glass button with a scroll-progress ring               */
/* ------------------------------------------------------------------ */
.to-top {
	position: fixed;
	inset-inline-start: 24px;
	bottom: 24px;
	z-index: 29;
	width: 58px;
	height: 58px;
	padding: 0;
	display: grid;
	place-items: center;
	border: 0;
	border-radius: var(--r-full);
	color: var(--wine);
	background: linear-gradient(160deg, rgba(255, 255, 255, .96), rgba(246, 227, 236, .92));
	-webkit-backdrop-filter: blur(12px);
	backdrop-filter: blur(12px);
	box-shadow: 0 14px 32px rgba(63, 29, 52, .18), inset 0 1px 0 #FFFFFF;
	cursor: pointer;
	opacity: 0;
	transform: translateY(16px) scale(.8);
	pointer-events: none;
	transition: opacity .3s ease, transform .35s cubic-bezier(.2, .8, .2, 1), box-shadow .2s ease;
}
.to-top.is-visible { opacity: 1; transform: none; pointer-events: auto; }
.to-top.is-visible:hover { box-shadow: 0 18px 38px rgba(147, 64, 111, .28), inset 0 1px 0 #FFFFFF; transform: translateY(-3px); }
.to-top svg.ring { position: absolute; inset: 0; width: 100%; height: 100%; transform: rotate(-90deg); overflow: visible; }
.to-top .ring-track { fill: none; stroke: rgba(194, 127, 164, .22); stroke-width: 2.5; }
.to-top .ring-fill { fill: none; stroke: url(#vlx-ring-grad); stroke-width: 2.5; stroke-linecap: round; transition: stroke-dashoffset .12s linear; }
.to-top .arrow { position: relative; width: 22px; height: 22px; transition: transform .25s ease; }
.to-top:hover .arrow { transform: translateY(-3px); }
.to-top.is-launching .arrow { animation: to-top-launch .7s cubic-bezier(.5, 0, .2, 1); }
.to-top .tip {
	position: absolute;
	inset-inline-start: calc(100% + 12px);
	white-space: nowrap;
	padding: 6px 12px;
	border-radius: var(--r-full);
	background: var(--ink);
	color: #FFFFFF;
	font-size: 13px;
	line-height: 18px;
	opacity: 0;
	pointer-events: none;
	transition: opacity .2s ease;
}
.to-top:hover .tip, .to-top:focus-visible .tip { opacity: 1; }
.to-top .tip b { font-family: var(--font-lat); font-weight: 500; color: #F3C7DE; }
.to-top .spark { position: absolute; width: 6px; height: 6px; border-radius: 50%; background: #E9A8CB; opacity: 0; pointer-events: none; }
.to-top.is-arrived .spark { animation: to-top-spark .7s ease-out forwards; }
@keyframes to-top-launch {
	0% { transform: none; }
	40% { transform: translateY(-26px); opacity: 0; }
	41% { transform: translateY(20px); opacity: 0; }
	100% { transform: none; opacity: 1; }
}
@keyframes to-top-spark {
	0% { opacity: 1; transform: translate(0, 0) scale(1); }
	100% { opacity: 0; transform: translate(var(--dx), var(--dy)) scale(.3); }
}
@media (max-width: 700px) {
	.to-top { inset-inline-start: 16px; bottom: 84px; width: 52px; height: 52px; }
	.to-top .tip { display: none; }
}
@media (prefers-reduced-motion: reduce) {
	.hdr-search-form, .to-top, .to-top .arrow { transition: none; }
	.to-top.is-launching .arrow, .to-top.is-arrived .spark { animation: none; }
}
#main:focus { outline: none; }

/* ------------------------------------------------------------------ */
/* Lotus mark (1.9.1): the brand lotus replaces the ✦ star separators  */
/* ------------------------------------------------------------------ */
.lotus-mark {
	display: inline-block;
	width: 1.25em;
	height: .82em;
	margin: 0 .3em;
	vertical-align: -.06em;
	font-style: normal;
	background: currentColor;
	color: var(--gold);
	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 200 130'%3E%3Cg fill='none' stroke='%23000' stroke-width='10' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M100 14C77 40 76 72 100 112C124 72 123 40 100 14Z'/%3E%3Cpath d='M100 112C61 106 42 81 44 47C77 52 94 77 100 112Z'/%3E%3Cpath d='M100 112C139 106 158 81 156 47C123 52 106 77 100 112Z'/%3E%3Cpath d='M100 112C59 122 24 102 12 77C52 72 84 87 100 112Z'/%3E%3Cpath d='M100 112C141 122 176 102 188 77C148 72 116 87 100 112Z'/%3E%3C/g%3E%3C/svg%3E") center / contain no-repeat;
	mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 200 130'%3E%3Cg fill='none' stroke='%23000' stroke-width='10' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M100 14C77 40 76 72 100 112C124 72 123 40 100 14Z'/%3E%3Cpath d='M100 112C61 106 42 81 44 47C77 52 94 77 100 112Z'/%3E%3Cpath d='M100 112C139 106 158 81 156 47C123 52 106 77 100 112Z'/%3E%3Cpath d='M100 112C59 122 24 102 12 77C52 72 84 87 100 112Z'/%3E%3Cpath d='M100 112C141 122 176 102 188 77C148 72 116 87 100 112Z'/%3E%3C/g%3E%3C/svg%3E") center / contain no-repeat;
}
.announcement .lotus-mark { color: #F3C7DE; padding: 0; }
.dialog-head h2 .lotus-mark { width: .9em; height: .6em; }
/* the Glow teaser now carries the club logo instead of a star */
.glow-teaser .glow-mark { display: block; width: max-content; margin-bottom: 8px; }
.glow-teaser-spark { display: none; }

/* ------------------------------------------------------------------ */
/* Ritual banner (1.9.2): translucent gold petals in the corner        */
/* ------------------------------------------------------------------ */
.ritual-banner { isolation: isolate; border-radius: 32px; }
.ritual-banner > * { position: relative; z-index: 1; }
.ritual-banner .banner-star { display: none; }
.ritual-banner::after {
	content: "";
	position: absolute;
	top: 0;
	inset-inline-start: 0;
	z-index: 0;
	width: min(44%, 520px);
	aspect-ratio: 760 / 631;
	background: url(ornament-petals.webp) top right / contain no-repeat;
	opacity: .62;
	pointer-events: none;
	transform-origin: top right;
	animation: petals-sway 14s ease-in-out infinite alternate;
}
/* English pages read left to right: the petals sit in the top-left corner */
html:not([dir="rtl"]) .ritual-banner::after { transform-origin: 50% 0; scale: -1 1; }
/* a soft light behind the text keeps it readable over the petals */
.ritual-banner::before {
	content: "";
	position: absolute;
	inset: 0;
	z-index: 0;
	background: radial-gradient(55% 70% at 50% 55%, rgba(147, 64, 111, .9), rgba(147, 64, 111, 0) 70%);
	pointer-events: none;
}
@keyframes petals-sway {
	from { transform: rotate(0deg) translate(0, 0); }
	to { transform: rotate(-1.6deg) translate(-6px, 4px); }
}
@media (max-width: 700px) {
	.ritual-banner { border-radius: 24px; }
	.ritual-banner::after { width: 72%; opacity: .38; }
}
@media (prefers-reduced-motion: reduce) {
	.ritual-banner::after { animation: none; }
}
/* 1.9.4: «GLOW CLUB» centred under the club logo */
.glow-teaser .glow-mark { margin-bottom: 6px; }
.glow-teaser .glow-mark + .eyebrow { display: block; width: 140px; text-align: center; letter-spacing: .18em; }

/* 1.9.5: the capsule works as a segmented control — hover fills each segment */
.hdr-tools { gap: 0; padding: 3px; }
header .hdr-tools :is(.account-link, .lang-switch, .search-toggle) {
	width: auto;
	min-width: 48px;
	height: 44px;
	min-height: 44px;
	padding: 0 14px;
	border-radius: 10px;
}
header .hdr-tools .lang-switch { padding: 0 16px; }
/* outer ends follow the capsule's round shape */
header .hdr-tools .hdr-search:not(.is-open) .search-toggle { border-start-start-radius: 999px; border-end-start-radius: 999px; }
header .hdr-tools .hdr-search.is-open .search-toggle { border-radius: 10px; }
header .hdr-tools .lang-switch { border-start-end-radius: 999px; border-end-end-radius: 999px; }
header .hdr-tools .hdr-search-form { border-start-start-radius: 999px; border-end-start-radius: 999px; }
/* dividers sit exactly on the segment boundaries and hide around the hovered one */
header .hdr-tools :is(.account-link, .lang-switch)::before { inset-inline-start: 0; top: 12px; bottom: 12px; }
header .hdr-tools .hdr-search:hover + .account-link::before,
header .hdr-tools .account-link:hover + .lang-switch::before { opacity: 0; }
header .hdr-tools :is(.account-link, .lang-switch, .search-toggle):hover,
header .hdr-tools :is(.account-link, .lang-switch, .search-toggle):focus-visible {
	background: #FFFFFF;
	box-shadow: 0 3px 10px rgba(147, 64, 111, .14), inset 0 0 0 1px rgba(235, 210, 223, .7);
}
@media (max-width: 700px) {
	header .hdr-tools :is(.account-link, .lang-switch, .search-toggle) { min-width: 42px; height: 40px; min-height: 40px; padding: 0 10px; }
	header .hdr-tools .lang-switch { padding: 0 10px; }
}
@media (max-width: 400px) {
	header .hdr-tools :is(.account-link, .search-toggle) { padding: 0 8px; min-width: 38px; }
	header .hdr-tools .lang-switch { padding: 0 8px; min-width: 38px; width: auto; }
}
/* open search: the field sits on white */
header .hdr-tools .hdr-search.is-open .hdr-search-form { background: #FFFFFF; box-shadow: inset 0 0 0 1px rgba(235, 210, 223, .8), 0 3px 10px rgba(147, 64, 111, .10); border-start-end-radius: 10px; border-end-end-radius: 10px; }
header .hdr-tools .hdr-search.is-open .hdr-search-form:focus-within { box-shadow: inset 0 0 0 1.5px rgba(162, 77, 126, .45), 0 3px 10px rgba(147, 64, 111, .12); }
header .hdr-tools .hdr-search.is-open .search-toggle { margin-inline-start: 3px; }
@media (max-width: 700px) { header .hdr-tools .hdr-search.is-open .hdr-search-form { border-radius: 999px; } header .hdr-tools .hdr-search.is-open .search-toggle { margin-inline-start: 0; } }

/* 1.9.6: footer phone and social links */
footer .footer-phone bdi { font-family: var(--font-lat); letter-spacing: .02em; unicode-bidi: isolate; }
.footer-social { margin-top: 24px; }
.footer-social-title { display: block; margin-bottom: 12px; font-size: 14px; line-height: 20px; font-weight: 500; color: var(--ink); }
.social-links { display: flex; flex-wrap: wrap; gap: 10px; }
.social-link {
	position: relative;
	display: inline-grid;
	place-items: center;
	width: 44px;
	height: 44px;
	border-radius: var(--r-full);
	color: var(--wine);
	background: linear-gradient(180deg, rgba(255, 255, 255, .95), rgba(255, 255, 255, .7));
	box-shadow: 0 6px 16px rgba(63, 29, 52, .08), inset 0 0 0 1px rgba(235, 210, 223, .9);
	text-decoration: none;
	transition: transform .2s ease, box-shadow .2s ease, color .2s ease, background .2s ease;
}
.social-link svg { position: relative; z-index: 1; }
.social-link::before {
	content: "";
	position: absolute;
	inset: 0;
	border-radius: inherit;
	background: linear-gradient(160deg, #B5649A, var(--wine) 55%, #7C3159);
	opacity: 0;
	transform: scale(.6);
	transition: opacity .25s ease, transform .3s cubic-bezier(.2, .8, .2, 1);
}
.social-link:hover,
.social-link:focus-visible { color: #FFFFFF; transform: translateY(-3px); box-shadow: 0 12px 24px rgba(147, 64, 111, .3); }
.social-link:hover::before,
.social-link:focus-visible::before { opacity: 1; transform: none; }
@media (prefers-reduced-motion: reduce) {
	.social-link, .social-link::before { transition: none; }
}

/* 1.9.7: copyright centred; the brands note sits with the other footer notes */
.copyright { text-align: center; }
.copyright bdi { font-family: var(--font-lat); letter-spacing: .04em; }
.footer-note p + p { margin-top: 8px; }

/* 1.9.8: payment & shipping trust strip above the copyright */
.trust-strip { grid-column: 1 / -1; }
.trust-strip ul {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 12px;
	margin: 0;
	padding: 16px;
	list-style: none;
	border: 1px solid rgba(255, 255, 255, .9);
	border-radius: 24px;
	background: linear-gradient(180deg, rgba(255, 255, 255, .7), rgba(255, 255, 255, .45));
	box-shadow: 0 10px 28px rgba(63, 29, 52, .07), inset 0 1px 0 #FFFFFF;
}
.trust-strip li {
	display: flex;
	align-items: center;
	gap: 12px;
	flex: 1 1 200px;
	max-width: 260px;
	min-height: 64px;
	padding: 8px 16px;
	border-radius: 16px;
}
.trust-strip li + li { border-inline-start: 1px solid rgba(235, 210, 223, .9); }
.trust-icon {
	display: inline-grid;
	place-items: center;
	flex: none;
	width: 44px;
	height: 44px;
	border-radius: var(--r-full);
	color: var(--wine);
	background: #FFFFFF;
	box-shadow: inset 0 0 0 1px rgba(235, 210, 223, .9), 0 4px 12px rgba(147, 64, 111, .1);
}
.trust-text { display: grid; gap: 2px; }
.trust-text b { margin: 0; font-size: 14px; line-height: 20px; font-weight: 500; color: var(--ink); }
.trust-text small { font-size: 13px; line-height: 18px; color: var(--muted); }
.trust-text .trust-partner {
	justify-self: start;
	font-family: var(--font-lat);
	font-size: 12px;
	font-weight: 600;
	letter-spacing: .08em;
	color: var(--wine);
	padding: 2px 10px;
	border-radius: var(--r-full);
	background: rgba(194, 127, 164, .14);
}
@media (max-width: 700px) {
	.trust-strip ul { padding: 8px; gap: 4px; }
	.trust-strip li { flex: 1 1 100%; max-width: none; min-height: 56px; }
	.trust-strip li + li { border-inline-start: 0; border-top: 1px solid rgba(235, 210, 223, .9); }
}

/* 1.10.0: footer columns — Help & policies, Support & contact; notes centred below */
footer { grid-template-columns: 1.3fr .8fr 1fr 1fr; }
footer .footer-note { grid-column: 1 / -1; text-align: center; color: var(--muted); }
footer .footer-note p { margin: 8px auto 0; max-width: 760px; }
footer .support-wa { color: var(--wine) !important; font-weight: 500; }
@media (max-width: 700px) {
	footer { grid-template-columns: 1fr 1fr; }
}
.trust-text .trust-link { font-size: 13px; line-height: 18px; color: var(--wine); text-decoration: underline; text-underline-offset: 3px; }

/* 1.12.0: story order spacing, voice & photo search, popular chips, fly-to-bag */
.brand-strip + .ritual-banner { margin-top: 64px; }
.ritual-banner + .store-discovery { padding-top: 64px; }

.hdr-search-form { display: flex; align-items: center; }
.hdr-search.is-open .hdr-search-form { width: 320px; }
.hdr-search-input { flex: 1 1 auto; min-width: 0; }
.hdr-voice, .hdr-photo {
	flex: none;
	display: inline-grid;
	place-items: center;
	width: 34px;
	height: 34px;
	margin-inline-end: 2px;
	padding: 0;
	border: 0;
	border-radius: var(--r-full);
	background: transparent;
	color: var(--wine);
	cursor: pointer;
	transition: background .2s ease;
}
.hdr-voice:hover, .hdr-photo:hover, .hdr-voice:focus-visible, .hdr-photo:focus-visible { background: var(--blush); }
.hdr-search.is-listening .hdr-voice { color: #FFFFFF; background: var(--wine); animation: hdr-listen 1.2s ease-in-out infinite; }
@keyframes hdr-listen { 0%, 100% { box-shadow: 0 0 0 0 rgba(147, 64, 111, .45); } 50% { box-shadow: 0 0 0 8px rgba(147, 64, 111, 0); } }

.hdr-chips-title { margin: 6px 10px 8px; font-size: 13px; line-height: 18px; color: var(--muted); }
.hdr-chips { display: flex; flex-wrap: wrap; gap: 8px; padding: 0 8px 8px; }
.hdr-chip {
	min-height: 36px;
	padding: 6px 14px;
	border: 0;
	border-radius: var(--r-full);
	background: #FFFFFF;
	color: var(--ink);
	font: inherit;
	font-size: 14px;
	box-shadow: inset 0 0 0 1px rgba(235, 210, 223, .95);
	cursor: pointer;
	transition: background .15s ease, color .15s ease;
}
.hdr-chip:hover { background: var(--wine); color: #FFFFFF; }
.hdr-chips-hint, .hdr-photo-note { margin: 4px 10px 6px; font-size: 12px; line-height: 18px; color: var(--muted); }
.hdr-photo-scan { display: flex; align-items: center; gap: 12px; padding: 10px; }
.hdr-photo-scan img { width: 56px; height: 56px; border-radius: 12px; object-fit: cover; }
.hdr-photo-scan span { position: relative; color: var(--wine); font-size: 14px; }
.hdr-photo-scan img { animation: hdr-scan 1.4s ease-in-out infinite; }
@keyframes hdr-scan { 0%, 100% { filter: brightness(1); } 50% { filter: brightness(1.25) saturate(1.2); } }

@media (max-width: 700px) {
	.hdr-search.is-open .hdr-search-form { width: auto !important; }
}

header .bag.is-bump { animation: bag-bump .8s cubic-bezier(.3, 1.6, .5, 1); }
header .bag.is-bump [data-count] { animation: count-pop .8s ease; }
header .bag.is-bump::after {
	content: "";
	position: absolute;
	inset: -6px;
	border-radius: 50%;
	border: 2px solid rgba(194, 127, 164, .7);
	animation: bag-ring .8s ease-out forwards;
	pointer-events: none;
}
@keyframes bag-bump { 0% { transform: scale(1); } 30% { transform: scale(1.18) rotate(-6deg); } 55% { transform: scale(.94) rotate(4deg); } 100% { transform: none; } }
@keyframes count-pop { 0%, 100% { transform: scale(1); } 40% { transform: scale(1.45); background: #F3C7DE; } }
@keyframes bag-ring { from { opacity: 1; transform: scale(.8); } to { opacity: 0; transform: scale(1.5); } }
@media (prefers-reduced-motion: reduce) {
	header .bag.is-bump, header .bag.is-bump [data-count], header .bag.is-bump::after, .hdr-search.is-listening .hdr-voice, .hdr-photo-scan img { animation: none; }
}

/* 1.13.0: the add-to-bag moment */
/* Button: ring while adding, check when added */
[data-add].is-adding, [data-bundle].is-adding { position: relative; color: transparent !important; opacity: 1 !important; cursor: progress; }
[data-add].is-adding > *, [data-bundle].is-adding > * { visibility: hidden; }
[data-add].is-adding::after, [data-bundle].is-adding::after {
	content: "";
	position: absolute;
	inset: 50% auto auto 50%;
	width: 18px;
	height: 18px;
	margin: -9px 0 0 -9px;
	border-radius: 50%;
	border: 2px solid rgba(255, 255, 255, .35);
	border-top-color: #FFFFFF;
	animation: vlx-spin .7s linear infinite;
}
.vlx-added-plus.is-adding::after { border-color: rgba(147, 64, 111, .25); border-top-color: var(--wine); }
[data-add].is-added, [data-bundle].is-added {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 6px;
	background: var(--wine) !important;
	color: #FFFFFF !important;
	opacity: 1 !important;
	animation: vlx-added-pop .5s cubic-bezier(.3, 1.6, .5, 1);
}
.vlx-check path { stroke-dasharray: 22; stroke-dashoffset: 22; animation: vlx-draw .45s .08s ease-out forwards; }
@keyframes vlx-spin { to { transform: rotate(360deg); } }
@keyframes vlx-draw { to { stroke-dashoffset: 0; } }
@keyframes vlx-added-pop { 0% { transform: scale(.86); } 60% { transform: scale(1.08); } 100% { transform: none; } }

/* The flying card */
.vlx-fly {
	position: fixed;
	left: 0;
	top: 0;
	z-index: 9999;
	width: 84px;
	height: 84px;
	overflow: hidden;
	border-radius: 24px;
	background: radial-gradient(circle at 50% 35%, #FFFFFF 0%, #FBEFF5 70%);
	box-shadow: 0 18px 40px rgba(147, 64, 111, .32), 0 0 0 1px rgba(235, 210, 223, .9), 0 0 0 5px rgba(255, 255, 255, .7);
	pointer-events: none;
	will-change: transform, opacity;
}
.vlx-fly .art-note, .vlx-fly .tag, .vlx-thumb .art-note, .vlx-thumb .tag { display: none !important; }

/* Petals */
.vlx-petal {
	position: fixed;
	z-index: 9998;
	width: 9px;
	height: 13px;
	margin: -6px 0 0 -4px;
	border-radius: 80% 0 80% 0;
	background: linear-gradient(135deg, #F7D3E4, #C27FA4);
	pointer-events: none;
	transform: rotate(var(--r));
}
.vlx-petal.is-gold { background: linear-gradient(135deg, #F6E6C8, #C9A46A); }
.vlx-petal--trail { width: 7px; height: 10px; opacity: .85; animation: vlx-petal-fall .8s ease-out forwards; }
.vlx-petal--bloom { animation: vlx-petal-bloom .75s cubic-bezier(.2, .7, .3, 1) forwards; }
@keyframes vlx-petal-fall { to { transform: translate(var(--dx), var(--dy)) rotate(calc(var(--r) + 120deg)) scale(.4); opacity: 0; } }
@keyframes vlx-petal-bloom {
	0% { transform: translate(0, 0) rotate(var(--r)) scale(.3); opacity: 0; }
	25% { opacity: 1; }
	100% { transform: translate(var(--dx), var(--dy)) rotate(var(--r)) scale(1); opacity: 0; }
}

/* The added card */
.vlx-added {
	position: fixed;
	z-index: 9997;
	width: min(360px, calc(100vw - 32px));
	padding: 16px 16px 14px;
	overflow: hidden;
	border-radius: 24px;
	background: rgba(255, 255, 255, .9);
	-webkit-backdrop-filter: blur(18px) saturate(1.3);
	backdrop-filter: blur(18px) saturate(1.3);
	box-shadow: 0 24px 60px rgba(63, 29, 52, .2), 0 0 0 1px rgba(235, 210, 223, .95);
	color: var(--ink);
	transform-origin: top center;
	animation: vlx-sheet-in .42s cubic-bezier(.2, .9, .3, 1.15) both;
}
.vlx-added::before {
	content: "";
	position: absolute;
	inset: -40% -20% auto auto;
	width: 220px;
	height: 220px;
	border-radius: 50%;
	background: radial-gradient(circle, rgba(243, 199, 222, .55), transparent 65%);
	pointer-events: none;
}
.vlx-added.is-leaving { animation: vlx-sheet-out .26s ease-in forwards; }
@keyframes vlx-sheet-in { from { opacity: 0; transform: translateY(-10px) scale(.94); filter: blur(4px); } to { opacity: 1; transform: none; filter: none; } }
@keyframes vlx-sheet-out { to { opacity: 0; transform: translateY(-6px) scale(.97); } }
.vlx-added > * { position: relative; animation: vlx-rise .4s ease-out both; }
.vlx-added > :nth-child(2) { animation-delay: .06s; }
.vlx-added > :nth-child(3) { animation-delay: .12s; }
.vlx-added > :nth-child(4) { animation-delay: .18s; }
.vlx-added > :nth-child(5) { animation-delay: .24s; }
@keyframes vlx-rise { from { opacity: 0; transform: translateY(6px); } to { opacity: 1; transform: none; } }

.vlx-added-head { display: flex; align-items: center; gap: 10px; margin-bottom: 12px; }
.vlx-added-head strong { flex: 1; font-size: 16px; line-height: 22px; font-weight: 700; color: var(--wine); }
.vlx-added-tick { display: inline-grid; place-items: center; width: 28px; height: 28px; border-radius: 50%; background: var(--wine); color: #FFFFFF; box-shadow: 0 0 0 5px rgba(147, 64, 111, .12); }
.vlx-added-x { display: inline-grid; place-items: center; width: 32px; height: 32px; padding: 0; border: 0; border-radius: 50%; background: transparent; color: var(--muted); cursor: pointer; }
.vlx-added-x:hover, .vlx-added-x:focus-visible { background: var(--blush); color: var(--wine); }

.vlx-added-item, .vlx-added-sug-row { display: flex; align-items: center; gap: 12px; }
.vlx-thumb {
	position: relative;
	flex: none;
	width: 58px;
	height: 58px;
	overflow: hidden;
	border-radius: 16px;
	background: radial-gradient(circle at 50% 35%, #FFFFFF, #FBEFF5 75%);
	box-shadow: inset 0 0 0 1px rgba(235, 210, 223, .95);
}
.vlx-added-sug .vlx-thumb { width: 44px; height: 44px; border-radius: 12px; }
.vlx-added-text { display: grid; flex: 1; min-width: 0; gap: 1px; }
.vlx-added-text small { font-size: 12px; line-height: 16px; letter-spacing: .04em; color: var(--muted); }
.vlx-added-text b { overflow: hidden; font-size: 15px; line-height: 21px; font-weight: 600; text-overflow: ellipsis; white-space: nowrap; }
.vlx-added-text span { font-size: 14px; line-height: 20px; color: var(--wine); font-weight: 600; }

.vlx-added-glow {
	display: flex;
	align-items: center;
	gap: 10px;
	margin: 12px 0 0;
	padding: 8px 12px;
	border-radius: 14px;
	background: linear-gradient(90deg, rgba(246, 227, 236, .9), rgba(246, 230, 200, .55));
	color: var(--ink);
	font-size: 13px;
	line-height: 19px;
	text-decoration: none;
}
.vlx-added-glow img { flex: none; width: 26px; height: 26px; object-fit: contain; }
.vlx-added-glow b { color: var(--wine); }
a.vlx-added-glow:hover { box-shadow: inset 0 0 0 1px rgba(194, 127, 164, .6); }

.vlx-added-sug { margin-top: 12px; padding-top: 12px; border-top: 1px dashed rgba(194, 127, 164, .45); }
.vlx-added-sug > p { margin: 0 0 8px; font-size: 13px; line-height: 18px; color: var(--muted); }
.vlx-added-sug .vlx-added-text b { font-size: 14px; line-height: 20px; }
.vlx-added-sug .vlx-added-text span { font-size: 13px; }
.vlx-added-plus {
	flex: none;
	min-height: 36px;
	padding: 6px 14px;
	border: 0;
	border-radius: var(--r-full);
	background: var(--blush);
	color: var(--wine);
	font: inherit;
	font-size: 14px;
	font-weight: 600;
	cursor: pointer;
	transition: background .15s ease, color .15s ease;
}
.vlx-added-plus:hover, .vlx-added-plus:focus-visible { background: var(--wine); color: #FFFFFF; }

.vlx-added-actions { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin-top: 14px; }
.vlx-added-actions button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	min-height: 44px;
	padding: 8px 12px;
	border: 0;
	border-radius: var(--r-full);
	font: inherit;
	font-size: 15px;
	font-weight: 600;
	cursor: pointer;
}
.vlx-added-bag { background: var(--wine); color: #FFFFFF; box-shadow: 0 8px 20px rgba(147, 64, 111, .28); }
.vlx-added-bag:hover, .vlx-added-bag:focus-visible { background: var(--wine-hover, #84395F); }
.vlx-added-count { display: inline-grid; place-items: center; min-width: 22px; height: 22px; padding: 0 6px; border-radius: var(--r-full); background: #FFFFFF; color: var(--wine); font-size: 13px; line-height: 1; }
.vlx-added-more { background: transparent; color: var(--wine); box-shadow: inset 0 0 0 1px rgba(194, 127, 164, .6); }
.vlx-added-more:hover, .vlx-added-more:focus-visible { background: var(--blush); }


@media (max-width: 700px) {
	.vlx-added {
		inset: auto 12px calc(12px + env(safe-area-inset-bottom)) 12px;
		width: auto;
		transform-origin: bottom center;
		animation-name: vlx-sheet-up;
	}
	.vlx-added.is-leaving { animation-name: vlx-sheet-down; }
	@keyframes vlx-sheet-up { from { opacity: 0; transform: translateY(24px) scale(.97); } to { opacity: 1; transform: none; } }
	@keyframes vlx-sheet-down { to { opacity: 0; transform: translateY(24px); } }
}
@media (prefers-reduced-motion: reduce) {
	.vlx-added, .vlx-added > *, .vlx-added.is-leaving, [data-add].is-added, [data-bundle].is-added, .vlx-check path { animation: none !important; }
	.vlx-check path { stroke-dashoffset: 0; }
	[data-add].is-adding::after, [data-bundle].is-adding::after { animation-duration: 1.6s; }
}

/* 1.14.0: added card as a mini bag (no timer, stepper and undo, subtotal, checkout first) */
.vlx-added { overflow-x: hidden; overflow-y: auto; overscroll-behavior: contain; scrollbar-width: thin; }
.vlx-added-grip { display: none; }
.vlx-added-item { align-items: flex-start; }
.vlx-added-item .vlx-added-text { padding-top: 2px; }
.vlx-added-text em { font-style: normal; font-size: 12px; line-height: 17px; color: var(--muted); }
.vlx-added-side { display: grid; flex: none; justify-items: end; gap: 8px; }
.vlx-added-price { font-size: 15px; line-height: 20px; font-weight: 700; color: var(--wine); }
.vlx-step {
	display: inline-flex;
	align-items: center;
	height: 34px;
	padding: 0 2px;
	border-radius: var(--r-full);
	background: #FFFFFF;
	box-shadow: inset 0 0 0 1px rgba(235, 210, 223, .95);
}
.vlx-step button {
	display: inline-grid;
	place-items: center;
	width: 30px;
	height: 30px;
	padding: 0;
	border: 0;
	border-radius: 50%;
	background: transparent;
	color: var(--wine);
	font: inherit;
	font-size: 16px;
	line-height: 1;
	cursor: pointer;
	transition: background .15s ease;
}
.vlx-step button:hover, .vlx-step button:focus-visible { background: var(--blush); }
.vlx-step output { min-width: 22px; font-size: 14px; font-weight: 700; text-align: center; color: var(--ink); }
.vlx-added.is-busy .vlx-step { opacity: .55; pointer-events: none; }
.vlx-added-undo {
	justify-self: start;
	margin-top: 4px;
	padding: 2px 0;
	border: 0;
	background: none;
	color: var(--wine);
	font: inherit;
	font-size: 14px;
	font-weight: 600;
	text-decoration: underline;
	text-underline-offset: 3px;
	cursor: pointer;
}
.vlx-added.is-removed .vlx-added-tick { background: var(--muted); box-shadow: 0 0 0 5px rgba(118, 88, 107, .12); }
.vlx-added.is-removed .vlx-added-item .vlx-thumb { filter: grayscale(.7); opacity: .55; }
.vlx-added.is-removed .vlx-added-item b { color: var(--muted); text-decoration: line-through; text-decoration-color: rgba(118, 88, 107, .5); }

.vlx-added-sum {
	display: flex;
	align-items: baseline;
	justify-content: space-between;
	gap: 12px;
	margin-top: 14px;
	padding-top: 12px;
	border-top: 1px solid rgba(235, 210, 223, .95);
	font-size: 14px;
	line-height: 20px;
	color: var(--muted);
}
.vlx-added-sum b { font-size: 17px; line-height: 24px; color: var(--ink); white-space: nowrap; }
.vlx-added-empty { margin: 14px 0 0; font-size: 14px; color: var(--muted); }
.vlx-added-actions { margin-top: 12px; }
.vlx-added-go {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	min-height: 46px;
	padding: 8px 14px;
	border-radius: var(--r-full);
	background: var(--wine);
	color: #FFFFFF !important;
	font-size: 15px;
	font-weight: 600;
	text-decoration: none !important;
	box-shadow: 0 8px 20px rgba(147, 64, 111, .28);
	transition: background .15s ease, transform .15s ease;
}
.vlx-added-go:hover, .vlx-added-go:focus-visible { background: var(--wine-hover, #84395F); }
.vlx-added-go span { transition: transform .2s ease; }
.vlx-added-go:hover span { transform: translateX(-3px); }
.vlx-added-go:hover span:dir(ltr), [dir="ltr"] .vlx-added-go:hover span { transform: translateX(3px); }
.vlx-added-actions .vlx-added-bag { min-height: 46px; background: transparent; color: var(--wine); box-shadow: inset 0 0 0 1px rgba(194, 127, 164, .6); }
.vlx-added-actions .vlx-added-bag:hover, .vlx-added-actions .vlx-added-bag:focus-visible { background: var(--blush); }
.vlx-added-more {
	display: block;
	min-height: 36px;
	margin: 6px auto 0;
	padding: 6px 12px;
	border: 0;
	border-radius: var(--r-full);
	background: none !important;
	box-shadow: none !important;
	color: var(--muted);
	font: inherit;
	font-size: 14px;
	text-decoration: underline;
	text-decoration-color: rgba(118, 88, 107, .35);
	text-underline-offset: 4px;
	cursor: pointer;
}
.vlx-added-more:hover, .vlx-added-more:focus-visible { color: var(--wine); }
.vlx-added.is-refresh .vlx-added-item { animation: vlx-refresh .7s ease; }
@keyframes vlx-refresh { 0% { background: rgba(243, 199, 222, .0); } 30% { background: rgba(243, 199, 222, .55); } 100% { background: rgba(243, 199, 222, 0); } }
.vlx-added-item { margin: 0 -8px; padding: 6px 8px; border-radius: 16px; }
.vlx-added.is-refresh .vlx-added-item .vlx-thumb { animation: vlx-added-pop .5s cubic-bezier(.3, 1.6, .5, 1); }

@media (max-width: 700px) {
	.vlx-added { max-height: calc(100vh - 150px); padding-top: 8px; }
	.vlx-added-grip { display: block; width: 40px; height: 4px; margin: 0 auto 10px; border-radius: 4px; background: rgba(147, 64, 111, .22); }
}
@media (prefers-reduced-motion: reduce) {
	.vlx-added.is-refresh .vlx-added-item, .vlx-added.is-refresh .vlx-added-item .vlx-thumb { animation: none; }
}

/* 1.14.0: the printed receipt */
.vlx-receipt { margin: 8px auto 40px; max-width: 460px; }
.vlx-receipt-stage { position: relative; margin: 0 auto; max-width: 420px; }
.vlx-receipt-wait { display: none; }
.vlx-paper {
	position: relative;
	padding: 30px 24px 22px;
	background:
		repeating-linear-gradient(0deg, rgba(147, 64, 111, .025) 0 1px, transparent 1px 4px),
		linear-gradient(180deg, #FFFFFF, #FFFBFD);
	color: var(--ink);
	font-size: 14px;
	line-height: 20px;
	font-variant-numeric: tabular-nums;
	-webkit-mask:
		conic-gradient(from 135deg at top, #0000, #000 1deg 89deg, #0000 90deg) top / 16px 9px repeat-x,
		linear-gradient(#000 0 0) bottom / 100% calc(100% - 9px) no-repeat;
	mask:
		conic-gradient(from 135deg at top, #0000, #000 1deg 89deg, #0000 90deg) top / 16px 9px repeat-x,
		linear-gradient(#000 0 0) bottom / 100% calc(100% - 9px) no-repeat;
}
.vlx-paper-clip { filter: drop-shadow(0 10px 18px rgba(63, 29, 52, .12)) drop-shadow(0 1px 0 rgba(235, 210, 223, .9)); }

.vlx-r-brand { display: grid; justify-items: center; gap: 2px; text-align: center; color: var(--wine); }
.vlx-r-lotus { width: 44px; height: 30px; }
.vlx-r-brand b { font-family: var(--font-lat, inherit); font-size: 17px; letter-spacing: .32em; margin-inline-start: .32em; font-weight: 600; }
.vlx-r-brand small { font-size: 12px; color: var(--muted); }
.vlx-r-title { margin: 14px 0 10px; font-size: 15px; font-weight: 700; text-align: center; letter-spacing: .02em; }
.vlx-receipt .vlx-r-meta, .vlx-receipt .vlx-r-sums { display: block; margin: 0; }
.vlx-receipt .vlx-r-meta div, .vlx-receipt .vlx-r-sums div { width: 100%; }
.vlx-r-meta div, .vlx-r-sums div { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; padding: 3px 0; }
.vlx-r-meta dt, .vlx-r-sums dt { color: var(--muted); }
.vlx-r-meta dd, .vlx-r-sums dd { margin: 0; text-align: end; font-weight: 600; }
.vlx-r-cut { height: 0; margin: 12px 0; border-top: 2px dashed rgba(194, 127, 164, .45); }
.vlx-r-items { margin: 0; padding: 0; list-style: none; }
.vlx-r-items li { display: grid; grid-template-columns: 1fr auto auto; align-items: baseline; gap: 10px; padding: 5px 0; }
.vlx-r-name { min-width: 0; }
.vlx-r-qty { color: var(--muted); font-size: 13px; }
.vlx-r-items b { font-weight: 600; }
.vlx-r-sums .is-off dd { color: #2F7D5B; }
.vlx-r-sums .vlx-r-total { margin-top: 8px; padding-top: 10px; border-top: 1px solid rgba(63, 29, 52, .85); }
.vlx-r-sums .vlx-r-total dt { color: var(--ink); font-weight: 700; font-size: 16px; }
.vlx-r-sums .vlx-r-total dd { color: var(--wine); font-size: 20px; font-weight: 700; }
.vlx-r-glow { margin: 14px 0 0; padding: 8px 12px; border-radius: 12px; background: linear-gradient(90deg, rgba(246, 227, 236, .9), rgba(246, 230, 200, .55)); font-size: 13px; text-align: center; }
.vlx-r-code { display: grid; justify-items: center; gap: 4px; margin-top: 16px; }
.vlx-r-barcode { width: 78%; height: 36px; fill: var(--ink); shape-rendering: crispEdges; }
.vlx-r-code small { font-family: var(--font-lat, inherit); font-size: 11px; letter-spacing: .3em; color: var(--muted); }
.vlx-r-thanks { margin: 14px 0 0; font-size: 14px; text-align: center; color: var(--wine); }

.vlx-receipt-actions { display: flex; flex-wrap: wrap; justify-content: center; gap: 10px; margin-top: 18px; }
.vlx-receipt-actions button {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	min-height: 46px;
	padding: 8px 20px;
	border: 0;
	border-radius: var(--r-full);
	font: inherit;
	font-size: 15px;
	font-weight: 600;
	cursor: pointer;
	transition: background .15s ease, opacity .3s ease;
}
.vlx-receipt-print { background: var(--wine); color: #FFFFFF; box-shadow: 0 8px 20px rgba(147, 64, 111, .28); }
.vlx-receipt-print:hover, .vlx-receipt-print:focus-visible { background: var(--wine-hover, #84395F); }
.vlx-receipt-replay { background: transparent; color: var(--wine); box-shadow: inset 0 0 0 1px rgba(194, 127, 164, .6); }
.vlx-receipt-replay:hover, .vlx-receipt-replay:focus-visible { background: var(--blush); }
.vlx-printer { display: none; }

/* Animated version (JavaScript adds .is-ready): the paper rises out of the printer slot */
.vlx-receipt.is-ready .vlx-receipt-stage { height: calc(var(--paper-h, 640px) + 70px); }
.vlx-receipt.is-ready .vlx-paper-clip {
	position: absolute;
	inset: auto 0 58px 0;
	z-index: 1;
	height: var(--paper-h, 640px);
	overflow: hidden;
	transition: height var(--feed, 200ms) steps(6, end);
}
.vlx-receipt.is-ready .vlx-paper { position: absolute; inset: 0 14px auto 14px; }
.vlx-receipt.is-ready.is-printed .vlx-paper-clip { height: var(--paper-h, 640px); }
.vlx-receipt.is-ready .vlx-printer {
	display: block;
	position: absolute;
	inset: auto -6px 0 -6px;
	z-index: 2;
	height: 70px;
	border-radius: 18px 18px 22px 22px;
	background: linear-gradient(180deg, #5A2A4C 0%, #3E1A35 46%, #2F1229 100%);
	box-shadow: 0 18px 36px rgba(63, 29, 52, .28), inset 0 1px 0 rgba(255, 255, 255, .18), inset 0 -3px 0 rgba(0, 0, 0, .25);
}
.vlx-printer::before {
	content: "";
	position: absolute;
	inset: 0 0 auto 0;
	height: 22px;
	border-radius: 18px 18px 0 0;
	background: linear-gradient(180deg, #7A3D66, #5A2A4C);
}
.vlx-printer-slot {
	position: absolute;
	inset: 8px 10px auto 10px;
	height: 7px;
	overflow: hidden;
	border-radius: 7px;
	background: #1A0914;
	box-shadow: inset 0 2px 3px rgba(0, 0, 0, .7), 0 1px 0 rgba(255, 255, 255, .15);
}
.vlx-receipt.is-printing .vlx-printer-slot::after {
	content: "";
	position: absolute;
	top: 0;
	bottom: 0;
	width: 30%;
	background: linear-gradient(90deg, transparent, rgba(243, 199, 222, .95), transparent);
	animation: vlx-head .55s ease-in-out infinite alternate;
}
@keyframes vlx-head { from { inset-inline-start: -10%; } to { inset-inline-start: 80%; } }
.vlx-printer-name {
	position: absolute;
	inset: auto 0 15px 0;
	font-family: var(--font-lat, inherit);
	font-size: 11px;
	letter-spacing: .5em;
	text-align: center;
	color: rgba(243, 199, 222, .55);
	text-shadow: 0 -1px 0 rgba(0, 0, 0, .35);
}
.vlx-printer-led {
	position: absolute;
	inset-inline-end: 22px;
	bottom: 18px;
	width: 7px;
	height: 7px;
	border-radius: 50%;
	background: #C9A46A;
	box-shadow: 0 0 6px rgba(201, 164, 106, .8);
}
.vlx-receipt.is-printing .vlx-printer-led { animation: vlx-led .5s steps(2, jump-none) infinite; }
.vlx-receipt.is-printing .vlx-printer { animation: vlx-hum .12s linear infinite alternate; }
@keyframes vlx-led { from { opacity: 1; } to { opacity: .25; } }
@keyframes vlx-hum { from { transform: translateY(0); } to { transform: translateY(.6px); } }

.vlx-receipt.is-ready .vlx-receipt-wait {
	display: grid;
	place-items: center;
	position: absolute;
	inset: 0 0 70px 0;
	margin: 0;
	color: var(--muted);
	font-size: 14px;
	transition: opacity .4s ease;
}
.vlx-receipt.is-printing .vlx-receipt-wait { animation: vlx-breathe 1.6s ease-in-out infinite; }
.vlx-receipt.is-printed .vlx-receipt-wait { opacity: 0; }
@keyframes vlx-breathe { 50% { opacity: .45; } }

.vlx-receipt.is-ready .r-line { opacity: 0; filter: blur(1.4px); transform: translateY(3px); }
.vlx-receipt.is-ready .r-line.is-in { opacity: 1; filter: none; transform: none; transition: opacity .4s ease, filter .5s ease, transform .4s ease; }
.vlx-receipt.is-torn .vlx-paper { transform-origin: 50% 100%; animation: vlx-sway 1.1s cubic-bezier(.3, 1.4, .5, 1); }
@keyframes vlx-sway { 0% { transform: translateY(-5px) rotate(-.9deg); } 45% { transform: translateY(0) rotate(.5deg); } 100% { transform: none; } }
.vlx-receipt.is-printing .vlx-receipt-actions { opacity: .5; }

@media (max-width: 480px) {
	.vlx-paper { padding: 26px 18px 18px; font-size: 13px; }
	.vlx-receipt.is-ready .vlx-paper { inset: 0 10px auto 10px; }
}
@media (prefers-reduced-motion: reduce) {
	.vlx-receipt .r-line { opacity: 1 !important; filter: none !important; transform: none !important; }
	.vlx-receipt *, .vlx-receipt { animation: none !important; transition: none !important; }
}

/* Print: only the receipt, at receipt width */
@media print {
	body * { visibility: hidden !important; }
	.vlx-paper, .vlx-paper * { visibility: visible !important; }
	.vlx-receipt-stage, .vlx-paper-clip { height: auto !important; filter: none !important; overflow: visible !important; position: static !important; }
	.vlx-paper {
		position: absolute !important;
		inset: 0 auto auto 50% !important;
		width: 88mm;
		transform: translateX(-50%) !important;
		-webkit-mask: none !important;
		mask: none !important;
		background: #FFFFFF !important;
		-webkit-print-color-adjust: exact;
		print-color-adjust: exact;
	}
	.vlx-receipt .r-line { opacity: 1 !important; filter: none !important; transform: none !important; }
	@page { margin: 10mm; }
}

/* 1.15.0: header tools engraved into the header (carved in, not stuck on) */
header .hdr-tools {
	border: 0;
	background: linear-gradient(180deg, #EAD4E0 0%, #F1E1EA 55%, #F5E8EF 100%);
	box-shadow:
		inset 0 4px 8px rgba(63, 29, 52, .20),
		inset 0 1px 2px rgba(63, 29, 52, .28),
		inset 0 -1px 0 rgba(255, 255, 255, .95),
		0 1px 0 rgba(255, 255, 255, 1),
		0 -1px 0 rgba(63, 29, 52, .07);
}
/* icons pressed into the surface, like letterpress */
header .hdr-tools :is(.account-link, .lang-switch, .search-toggle) {
	color: #5A2F4C;
	background: transparent;
	text-shadow: 0 1px 0 rgba(255, 255, 255, .9);
}
header .hdr-tools :is(.account-link, .lang-switch, .search-toggle) svg { filter: drop-shadow(0 1px 0 rgba(255, 255, 255, .95)); }
/* hover: the segment sinks a little deeper instead of popping out */
header .hdr-tools :is(.account-link, .lang-switch, .search-toggle):hover,
header .hdr-tools :is(.account-link, .lang-switch, .search-toggle):focus-visible {
	background: rgba(147, 64, 111, .07);
	color: var(--wine);
	box-shadow: inset 0 2px 4px rgba(63, 29, 52, .14), inset 0 -1px 0 rgba(255, 255, 255, .7);
}
/* carved dividers: a dark groove with a light lip */
header .hdr-tools :is(.account-link, .lang-switch)::before {
	background: linear-gradient(180deg, transparent, rgba(63, 29, 52, .16), transparent);
	box-shadow: 1px 0 0 rgba(255, 255, 255, .9);
}
header .hdr-tools .hdr-search.is-open .hdr-search-form { box-shadow: inset 0 2px 4px rgba(63, 29, 52, .12), inset 0 0 0 1px rgba(235, 210, 223, .9); }

/* bag: seated in a carved well, flush with the header instead of floating above it */
header .nav-actions .bag {
	box-shadow:
		0 2px 3px rgba(63, 29, 52, .30),
		inset 0 1px 0 rgba(255, 255, 255, .28),
		inset 0 -3px 6px rgba(40, 10, 30, .22),
		0 0 0 6px #EAD4E0,
		0 2px 0 6.5px rgba(255, 255, 255, 1),
		0 -2px 2px 6.5px rgba(63, 29, 52, .22);
}
header .nav-actions .bag:hover {
	transform: none;
	background: linear-gradient(160deg, #B5649A, var(--wine) 55%, #722B51);
	box-shadow:
		0 1px 2px rgba(63, 29, 52, .30),
		inset 0 1px 0 rgba(255, 255, 255, .3),
		inset 0 -2px 5px rgba(40, 10, 30, .2),
		0 0 0 5px #EAD5E0,
		0 1.5px 0 5.5px rgba(255, 255, 255, 1),
		0 -1.5px 1px 5.5px rgba(63, 29, 52, .2);
}
header .nav-actions .bag:active { box-shadow: inset 0 2px 6px rgba(40, 10, 30, .35), 0 0 0 5px #EAD5E0, 0 1.5px 0 5.5px #FFFFFF, 0 -1.5px 1px 5.5px rgba(63, 29, 52, .2); }
header .bag [data-count] { box-shadow: 0 1px 3px rgba(63, 29, 52, .25), 0 0 0 2px #F6EAF0; }

/* 1.16.0: pure minimal header tools. No capsule, no pink fills: thin icons with small labels,
   a quiet gold line on hover, the bag as an outline icon with a plum count.
   Search opens as a white field in the middle of the header, in place of the menu. */
header .hdr-tools {
	gap: 4px;
	height: auto;
	padding: 0;
	border: 0 !important;
	border-radius: 0;
	background: none !important;
	box-shadow: none !important;
}
header .hdr-tools :is(.account-link, .lang-switch, .search-toggle),
header .nav-actions .bag {
	position: relative;
	display: inline-flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 5px;
	width: auto !important;
	min-width: 56px !important;
	height: 58px !important;
	min-height: 58px !important;
	padding: 4px 8px !important;
	border: 0 !important;
	border-radius: 14px !important;
	background: none !important;
	box-shadow: none !important;
	color: var(--ink) !important;
	text-shadow: none !important;
	transform: none !important;
	transition: color .2s ease;
}
header .hdr-tools :is(.account-link, .lang-switch, .search-toggle) svg { filter: none !important; width: 22px; height: 22px; }
header .hdr-search-input, header .hdr-search-input:focus, header .hdr-search-input:focus-visible { outline: none !important; }
header .hdr-tools :is(.account-link, .lang-switch)::before { content: none !important; }
/* labels */
header .hdr-tools :is(.account-link, .search-toggle)::after,
header .hdr-tools .lang-switch span,
header .nav-actions .bag .vlx-bag-label {
	position: static;
	width: auto;
	height: auto;
	overflow: visible;
	clip-path: none;
	display: block;
	padding-bottom: 3px;
	font-family: inherit;
	font-size: 12px;
	line-height: 14px;
	font-weight: 400;
	letter-spacing: 0;
	color: var(--muted);
	white-space: nowrap;
	background: linear-gradient(90deg, #C9A46A, #C9A46A) no-repeat 50% 100% / 0 1px;
	transition: color .2s ease, background-size .3s cubic-bezier(.2, .8, .2, 1);
}
header .hdr-tools :is(.account-link, .search-toggle)::after { content: attr(data-label); }
header .hdr-tools .lang-switch span:lang(en) { font-family: var(--font-lat); letter-spacing: .04em; }
/* hover: icon to plum, a gold hairline draws under the label */
header .hdr-tools :is(.account-link, .lang-switch, .search-toggle):is(:hover, :focus-visible),
header .nav-actions .bag:is(:hover, :focus-visible) { color: var(--wine) !important; background: none !important; box-shadow: none !important; }
header .hdr-tools :is(.account-link, .search-toggle):is(:hover, :focus-visible)::after,
header .hdr-tools .lang-switch:is(:hover, :focus-visible) span,
header .nav-actions .bag:is(:hover, :focus-visible) .vlx-bag-label { color: var(--wine); background-size: 100% 1px; }
header .hdr-tools :is(.account-link, .lang-switch, .search-toggle):focus-visible,
header .nav-actions .bag:focus-visible { outline: 1.5px solid rgba(147, 64, 111, .5) !important; outline-offset: 2px; }
header .account-link .account-dot { top: 6px !important; inset-inline-end: 14px !important; bottom: auto !important; width: 8px !important; height: 8px !important; border-width: 1.5px !important; }

/* bag: outline icon with the lotus, plum count */
header .nav-actions .bag .vlx-bag-icon { width: 26px; height: 26px; color: var(--ink); }
header .nav-actions .bag:is(:hover, :focus-visible) .vlx-bag-icon { color: var(--wine); }
header .nav-actions .bag .vlx-bag-icon path[stroke]:not([stroke="currentColor"]) { stroke: var(--wine) !important; }
header .nav-actions .bag [data-count] {
	top: -2px !important;
	inset-inline-end: 2px !important;
	min-width: 18px;
	height: 18px;
	padding: 0 5px;
	border-radius: 999px;
	background: var(--wine) !important;
	color: #FFFFFF !important;
	font-size: 11px;
	line-height: 18px;
	box-shadow: 0 0 0 2px var(--paper) !important;
}
header .bag.is-bump::after { inset: 4px 10px 20px; }

/* search: the toggle becomes a close button with its own label */
header .hdr-tools .hdr-search.is-open .search-toggle { background: none !important; color: var(--wine) !important; margin: 0 !important; border-radius: 14px !important; }

@media (min-width: 701px) {
	header .nav-actions, header .hdr-tools, header .hdr-search { position: static !important; }
	header .hdr-tools .hdr-search-form {
		position: absolute;
		top: 50%;
		left: 50%;
		z-index: 71;
		display: flex;
		align-items: center;
		width: clamp(320px, 100% - 720px, 640px) !important;
		height: 52px;
		padding-inline: 6px;
		border-radius: 999px !important;
		background: #FFFFFF !important;
		box-shadow: 0 0 0 1px #E9DFE3, 0 10px 30px rgba(63, 29, 52, .08) !important;
		opacity: 0;
		pointer-events: none;
		transform: translate(-50%, -50%) scaleX(.94);
		transition: opacity .25s ease, transform .35s cubic-bezier(.2, .8, .2, 1), box-shadow .2s ease;
	}
	header .hdr-tools .hdr-search.is-open .hdr-search-form { opacity: 1; pointer-events: auto; transform: translate(-50%, -50%); }
	header .hdr-tools .hdr-search.is-open .hdr-search-form:focus-within { box-shadow: 0 0 0 1px rgba(147, 64, 111, .55), 0 10px 30px rgba(63, 29, 52, .10) !important; }
	header .hdr-search-input { height: 52px; font-size: 16px; }
	header.search-open nav#site-nav { opacity: 0 !important; visibility: hidden; transition: opacity .2s ease, visibility 0s .2s; }
	header .hdr-search-results {
		inset-inline: auto;
		top: calc(50% + 36px);
		left: 50%;
		width: clamp(320px, 100% - 720px, 640px);
		transform: translateX(-50%);
	}
}
header .hdr-voice, header .hdr-photo { color: var(--muted) !important; background: none !important; }
header .hdr-voice:hover, header .hdr-photo:hover { color: var(--wine) !important; background: #F7F2F4 !important; }

/* results: white, hairline, no pink wash */
header .hdr-search-results {
	padding: 12px;
	border: 1px solid #EEE6E9 !important;
	border-radius: 22px;
	background: #FFFFFF !important;
	-webkit-backdrop-filter: none !important;
	backdrop-filter: none !important;
	box-shadow: 0 24px 48px rgba(63, 29, 52, .10), 0 2px 6px rgba(63, 29, 52, .05) !important;
}
header .hdr-search-results a:hover, header .hdr-search-results a[aria-selected="true"] { background: #F8F4F5; }
header .hdr-search-results a.hdr-all { border-top: 1px solid #F0E9EC; }
header .hdr-chips-title { margin: 4px 8px 10px; font-size: 12px; letter-spacing: .02em; color: var(--muted); }
header .hdr-chip {
	min-height: 34px;
	padding: 5px 14px;
	background: #FFFFFF !important;
	color: var(--ink) !important;
	box-shadow: inset 0 0 0 1px #E6DCE0 !important;
}
header .hdr-chip:hover, header .hdr-chip:focus-visible { background: #FFFFFF !important; color: var(--wine) !important; box-shadow: inset 0 0 0 1px var(--wine) !important; }
header .hdr-chips-hint { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; margin: 8px 8px 2px; padding-top: 10px; border-top: 1px solid #F2ECEE; }
header .hdr-chips-hint svg { flex: none; color: var(--wine); }

@media (max-width: 700px) {
	header .hdr-tools :is(.account-link, .lang-switch, .search-toggle),
	header .nav-actions .bag { min-width: 40px !important; height: 44px !important; min-height: 44px !important; padding: 2px 6px !important; gap: 0; }
	header .hdr-tools :is(.account-link, .search-toggle)::after,
	header .nav-actions .bag .vlx-bag-label { display: none; }
	header .hdr-tools .lang-switch span { display: none; }
	header .hdr-tools .hdr-search-form { background: #FFFFFF !important; box-shadow: 0 0 0 1px #E9DFE3, 0 16px 40px rgba(63, 29, 52, .12) !important; }
	header .nav-actions .bag [data-count] { inset-inline-end: 0 !important; }
}
header .hdr-tools .hdr-search.is-open .search-toggle::after { content: attr(data-close); }
/* phone: the menu button matches the minimal icons (no raised circle) */
@media (max-width: 700px) {
	header .menu-toggle { border: 0 !important; background: none !important; box-shadow: none !important; color: var(--ink) !important; }
}

/* 1.17.0: more presence for the minimal header. Bolder icons, a soft halo on hover,
   a gold hairline separator, and the bag as a solid plum pill (the one strong anchor). */
header .hdr-tools :is(.account-link, .lang-switch, .search-toggle) { min-width: 60px !important; color: #3F1D34 !important; }
header .hdr-tools :is(.account-link, .lang-switch, .search-toggle) svg { width: 24px !important; height: 24px !important; stroke-width: 1.65; position: relative; z-index: 1; }
header .hdr-tools :is(.account-link, .search-toggle)::after,
header .hdr-tools .lang-switch span { color: #5C3A50; font-size: 12.5px; position: relative; z-index: 1; }
/* soft halo behind the icon */
header .hdr-tools :is(.account-link, .lang-switch, .search-toggle)::before {
	content: "" !important;
	position: absolute;
	top: 2px;
	left: 50%;
	inset-inline-start: auto;
	bottom: auto;
	width: 40px;
	height: 40px;
	margin-left: -20px;
	border-radius: 50%;
	background: rgba(147, 64, 111, .09);
	box-shadow: none;
	opacity: 0;
	transform: scale(.6);
	transition: opacity .25s ease, transform .35s cubic-bezier(.2, .9, .3, 1.3);
}
header .hdr-tools :is(.account-link, .lang-switch, .search-toggle):is(:hover, :focus-visible)::before { opacity: 1 !important; transform: scale(1); }
header .hdr-tools .hdr-search.is-open .search-toggle::before { opacity: 1; transform: scale(1); background: rgba(147, 64, 111, .12); }
header .account-link .account-dot { z-index: 2; }

/* gold hairline between the tools and the bag */
header .hdr-tools::after {
	content: "";
	flex: none;
	width: 1px;
	height: 30px;
	margin-inline: 10px 6px;
	background: linear-gradient(180deg, transparent, #C9A46A 30%, #C9A46A 70%, transparent);
	opacity: .7;
}

/* bag: a solid plum pill with label and a champagne count */
header .nav-actions .bag {
	flex-direction: row !important;
	gap: 10px !important;
	min-width: 0 !important;
	height: 48px !important;
	min-height: 48px !important;
	padding: 0 8px 0 18px !important;
	border-radius: 999px !important;
	background: linear-gradient(135deg, #A24D7E 0%, #93406F 45%, #7A3159 100%) !important;
	color: #FFFFFF !important;
	box-shadow: 0 8px 20px rgba(147, 64, 111, .26), inset 0 1px 0 rgba(255, 255, 255, .22) !important;
	transition: box-shadow .25s ease, transform .25s ease, background .25s ease !important;
}
[dir="rtl"] header .nav-actions .bag, header .nav-actions .bag:dir(rtl) { padding: 0 18px 0 8px !important; }
header .nav-actions .bag:is(:hover, :focus-visible) {
	color: #FFFFFF !important;
	background: linear-gradient(135deg, #AD5A8A 0%, #8C3A69 45%, #6E2B50 100%) !important;
	box-shadow: 0 12px 26px rgba(147, 64, 111, .34), inset 0 1px 0 rgba(255, 255, 255, .25) !important;
	transform: translateY(-1px) !important;
}
header .nav-actions .bag .vlx-bag-icon { width: 24px; height: 24px; color: #FFFFFF !important; }
header .nav-actions .bag .vlx-bag-icon path[stroke]:not([stroke="currentColor"]) { stroke: #E9D2A8 !important; }
header .nav-actions .bag .vlx-bag-label {
	padding: 0 !important;
	background: none !important;
	color: #FFFFFF !important;
	font-size: 14px !important;
	line-height: 1 !important;
	font-weight: 500 !important;
}
header .nav-actions .bag [data-count] {
	position: static !important;
	display: inline-grid;
	place-items: center;
	min-width: 26px;
	height: 26px;
	padding: 0 7px;
	border-radius: 999px;
	background: #F2E3C6 !important;
	color: #6E2B50 !important;
	font-size: 12px;
	font-weight: 700;
	line-height: 26px;
	box-shadow: inset 0 0 0 1px rgba(201, 164, 106, .6) !important;
}
header .bag.is-bump::after { inset: -4px !important; border-radius: 999px !important; }

@media (max-width: 700px) {
	header .hdr-tools::after { display: none; }
	header .hdr-tools :is(.account-link, .lang-switch, .search-toggle) { min-width: 40px !important; }
	header .hdr-tools :is(.account-link, .lang-switch, .search-toggle)::before { top: 2px; }
	header .nav-actions .bag, [dir="rtl"] header .nav-actions .bag { height: 42px !important; min-height: 42px !important; padding: 0 6px 0 10px !important; gap: 6px !important; }
	[dir="rtl"] header .nav-actions .bag { padding: 0 10px 0 6px !important; }
	header .nav-actions .bag .vlx-bag-label { display: none !important; }
	header .nav-actions .bag [data-count] { min-width: 22px; height: 22px; line-height: 22px; font-size: 11px; }
}

/* 1.17.1: search expands out of its icon again, over the menu (the menu fades) instead of squeezing it */
@media (min-width: 701px) {
	header .hdr-tools .hdr-search { position: relative !important; }
	header .hdr-tools .hdr-search-form {
		left: auto;
		right: auto;
		inset-inline-end: calc(100% + 4px);
		top: 50%;
		width: 52px !important;
		transform: translateY(-50%);
		transition: width .55s cubic-bezier(.2, .85, .2, 1), opacity .2s ease, box-shadow .2s ease;
	}
	header .hdr-tools .hdr-search.is-open .hdr-search-form {
		width: clamp(280px, 100vw - 780px, 560px) !important;
		transform: translateY(-50%);
	}
	header .hdr-search-results {
		left: auto;
		right: auto;
		inset-inline-end: calc(100% + 4px);
		top: calc(50% + 36px);
		width: clamp(280px, 100vw - 780px, 560px);
		transform: none;
		transform-origin: top;
	}
	header.search-open nav#site-nav { transition: opacity .25s ease, visibility 0s .25s; }
}

/* 1.18.0: VARIALUXE icon set (one gold petal detail per icon, drawn on hover) */
.vlx-ico .ico-accent { stroke: #C9A46A; stroke-dasharray: 60; stroke-dashoffset: 0; transition: stroke .2s ease; }
header :is(.account-link, .lang-switch, .search-toggle):is(:hover, :focus-visible) .vlx-ico .ico-accent { stroke: #B48743; animation: vlx-ico-draw .7s cubic-bezier(.3, .7, .2, 1); }
@keyframes vlx-ico-draw { from { stroke-dashoffset: 60; } to { stroke-dashoffset: 0; } }
header .hdr-tools :is(.account-link, .lang-switch, .search-toggle) .vlx-ico { stroke-width: 1.5; }

/* 1.18.0: the bag is a side drawer from the bag's side, not a centred popup */
dialog#cart {
	--drawer-from: 100%;
	position: fixed;
	inset: 0;
	width: min(440px, 100vw);
	max-width: 100vw;
	height: 100dvh;
	max-height: 100dvh;
	margin: 0;
	margin-inline-start: auto;
	padding: 0;
	overflow: hidden;
	border: 0;
	border-radius: 0;
	border-start-start-radius: 28px;
	border-end-start-radius: 28px;
	background: var(--paper);
	box-shadow: 0 0 70px rgba(63, 29, 52, .2);
}
[dir="rtl"] dialog#cart, dialog#cart:dir(rtl) { --drawer-from: -100%; }
dialog#cart[open] { display: flex; flex-direction: column; animation: vlx-drawer-in .45s cubic-bezier(.2, .85, .2, 1); }
dialog#cart.is-closing { animation: vlx-drawer-out .26s ease-in forwards; }
dialog#cart::backdrop { background: rgba(43, 18, 36, .34); -webkit-backdrop-filter: blur(3px); backdrop-filter: blur(3px); animation: vlx-fade .3s ease; }
dialog#cart.is-closing::backdrop { opacity: 0; transition: opacity .26s ease; }
@keyframes vlx-drawer-in { from { transform: translateX(var(--drawer-from)); } to { transform: none; } }
@keyframes vlx-drawer-out { to { transform: translateX(var(--drawer-from)); } }
@keyframes vlx-fade { from { opacity: 0; } }

dialog#cart .dialog-head { flex: none; margin: 0; padding: 22px 24px 16px; border-bottom: 1px solid var(--line); }
dialog#cart .dialog-head h2 { display: flex; align-items: center; gap: 10px; font-size: 22px; line-height: 30px; }
dialog#cart .cart-count-chip { display: inline-grid; place-items: center; min-width: 26px; height: 26px; padding: 0 8px; border-radius: 999px; background: var(--wine); color: #FFFFFF; font-family: var(--font-lat); font-size: 13px; font-weight: 600; }
dialog#cart .dialog-head button { width: 40px; height: 40px; min-width: 40px; border: 0; background: transparent; color: var(--ink); transition: background .2s ease, transform .3s ease; }
dialog#cart .dialog-head button:hover, dialog#cart .dialog-head button:focus-visible { background: var(--blush); transform: rotate(90deg); }

#cart-free { flex: none; margin: 14px 24px 0; padding: 12px 14px; border-radius: 16px; background: linear-gradient(90deg, #F8EEF3, #F6EEDF); }
#cart-free p { margin: 0 0 8px; font-size: 14px; line-height: 20px; color: var(--ink); }
#cart-free b { color: var(--wine); }
.cart-free-bar { display: block; height: 6px; overflow: hidden; border-radius: 6px; background: rgba(147, 64, 111, .12); }
.cart-free-bar i { display: block; height: 100%; border-radius: inherit; background: linear-gradient(90deg, #C27FA4, #93406F); transition: width .7s cubic-bezier(.2, .8, .2, 1); }
#cart-free.is-done .cart-free-bar i { background: linear-gradient(90deg, #C9A46A, #93406F); }

#cart-items { flex: 1 1 auto; min-height: 0; overflow-y: auto; overscroll-behavior: contain; padding: 4px 24px; }
dialog#cart .cart-row { display: grid; grid-template-columns: 76px minmax(0, 1fr) auto; align-items: center; gap: 14px; padding: 16px 0; border-bottom: 1px solid var(--line); }
dialog#cart .cart-row:last-child { border-bottom: 0; }
.cart-thumb { display: block; width: 76px; height: 76px; overflow: hidden; border-radius: 18px; background: #FFFFFF; box-shadow: inset 0 0 0 1px var(--line); }
.cart-thumb img { width: 100%; height: 100%; object-fit: cover; }
.cart-thumb-blank { display: block; width: 100%; height: 100%; background: radial-gradient(circle at 50% 35%, #FFFFFF, #FBEFF5 75%); }
dialog#cart .cart-info { display: grid; gap: 2px; min-width: 0; }
dialog#cart .cart-info h3 { font-size: 15px; line-height: 22px; font-weight: 600; }
dialog#cart .cart-info h3 a { color: inherit; text-decoration: none; }
dialog#cart .cart-info h3 a:hover { color: var(--wine); }
dialog#cart .cart-info small { font-size: 14px; line-height: 20px; font-weight: 600; color: var(--wine); }
.cart-remove { justify-self: start; margin-top: 2px; padding: 2px 0; border: 0; background: none; color: var(--muted); font: inherit; font-size: 13px; text-decoration: underline; text-decoration-color: rgba(118, 88, 107, .35); text-underline-offset: 3px; cursor: pointer; }
.cart-remove:hover, .cart-remove:focus-visible { color: var(--wine); }
dialog#cart .qty { gap: 0; height: 36px; padding: 0 2px; border-radius: 999px; background: #FFFFFF; box-shadow: inset 0 0 0 1px var(--line); }
dialog#cart .qty button { width: 32px; height: 32px; min-width: 32px; border: 0; border-radius: 50%; background: none; color: var(--wine); font-size: 15px; }
dialog#cart .qty button:hover { background: var(--blush); }
dialog#cart .qty span { min-width: 20px; text-align: center; font-family: var(--font-lat); font-size: 14px; font-weight: 600; }

.cart-empty { display: grid; justify-items: center; gap: 4px; padding: 56px 12px; text-align: center; color: var(--wine); }
.cart-empty p { margin: 10px 0 0; font-size: 18px; line-height: 26px; color: var(--ink); }
.cart-empty small { font-size: 14px; color: var(--muted); }

dialog#cart .cart-foot { flex: none; padding: 16px 24px calc(18px + env(safe-area-inset-bottom)); border-top: 1px solid var(--line); background: rgba(255, 255, 255, .65); }
dialog#cart #cart-summary .cart-total { margin: 0 0 6px; font-size: 17px; }
dialog#cart .cart-foot .muted { margin: 0 0 6px; font-size: 12.5px; line-height: 18px; }
dialog#cart .cart-foot .notice { margin: 0 0 12px; padding: 0; background: none; font-size: 12.5px; line-height: 18px; color: var(--muted); }
dialog#cart #checkout-link { display: flex; align-items: center; justify-content: center; width: 100%; min-height: 52px; border-radius: 999px; }
dialog#cart .copy-secondary { margin: 10px auto 0; font-size: 13px; color: var(--muted); }
dialog#cart .vlx-bag-discounts { margin: 0 0 8px; }

@media (max-width: 560px) {
	dialog#cart { width: 100vw; border-radius: 0 !important; }
	#cart-items { padding: 4px 16px; }
	dialog#cart .dialog-head, dialog#cart .cart-foot { padding-inline: 16px; }
	#cart-free { margin-inline: 16px; }
	dialog#cart .cart-row { grid-template-columns: 64px minmax(0, 1fr) auto; gap: 12px; }
	.cart-thumb { width: 64px; height: 64px; border-radius: 14px; }
}
@media (prefers-reduced-motion: reduce) {
	dialog#cart[open], dialog#cart.is-closing, dialog#cart::backdrop { animation: none !important; }
	header :is(.account-link, .lang-switch, .search-toggle):hover .vlx-ico .ico-accent { animation: none; }
}
/* 1.18.2: one scroll area (progress, items, totals, Glow box); only the checkout button stays fixed */
dialog#cart .cart-scroll { flex: 1 1 auto; min-height: 0; overflow-y: auto; overscroll-behavior: contain; }
dialog#cart #cart-items { flex: none; min-height: 0; overflow: visible; }
dialog#cart #cart-summary { padding: 8px 24px 0; }
dialog#cart #cart-summary .cart-total { margin: 8px 0 4px; }
dialog#cart .cart-scroll > .notice { display: none; }
dialog#cart #cart-summary .muted { margin: 0 0 12px; font-size: 12.5px; line-height: 18px; }
dialog#cart .cart-foot { box-shadow: 0 -12px 24px rgba(63, 29, 52, .05); }
dialog#cart .dialog-head button:focus:not(:focus-visible) { outline: none; box-shadow: none; }
@media (max-width: 560px) { dialog#cart #cart-summary { padding-inline: 16px; } }
dialog#cart #cart-title:focus { outline: none; }

/* 1.19.0: non-modal bag drawer on the same page (no dimming), "just added" highlight, routine pairing */
dialog#cart {
	z-index: 10000;
	width: min(440px, calc(100vw - 44px));
	box-shadow: 0 0 0 1px rgba(235, 210, 223, .9), 0 24px 70px rgba(63, 29, 52, .22), 0 4px 14px rgba(63, 29, 52, .08);
}
dialog#cart .cart-row { transition: background .4s ease; }
dialog#cart .cart-row.is-new {
	margin: 8px -12px 4px;
	padding: 14px 12px;
	border-bottom-color: transparent;
	border-radius: 18px;
	background: linear-gradient(135deg, rgba(246, 227, 236, .9), rgba(246, 236, 222, .7));
	animation: vlx-new-row .9s cubic-bezier(.2, .9, .3, 1.2);
}
@keyframes vlx-new-row { 0% { opacity: 0; transform: translateY(-8px) scale(.98); } 100% { opacity: 1; transform: none; } }
.cart-new-tag { display: inline-flex; align-items: center; gap: 4px; justify-self: start; margin-bottom: 2px; font-size: 12px; font-weight: 600; color: var(--wine); }
#cart-pair { margin: 4px 24px 6px; }
#cart-pair .vlx-added-sug { margin-top: 6px; }
#cart-pair .vlx-thumb { width: 44px; height: 44px; border-radius: 12px; }
@media (max-width: 560px) {
	dialog#cart { width: calc(100vw - 44px) !important; border-start-start-radius: 24px !important; border-end-start-radius: 24px !important; }
	#cart-pair { margin-inline: 16px; }
}
@media (prefers-reduced-motion: reduce) { dialog#cart .cart-row.is-new { animation: none; } }
.admin-bar dialog#cart { top: 32px; height: calc(100dvh - 32px); max-height: calc(100dvh - 32px); }
@media (max-width: 782px) { .admin-bar dialog#cart { top: 46px; height: calc(100dvh - 46px); max-height: calc(100dvh - 46px); } }
/* empty bag: no zero total, no copy button */
dialog#cart #cart-items:has(.cart-empty) ~ #cart-summary, dialog#cart:has(.cart-empty) .copy-secondary, dialog#cart:has(.cart-empty) #cart-pair { display: none; }
dialog#cart:has(.cart-empty) .cart-scroll { display: flex; flex-direction: column; justify-content: center; }