/**
 * Bioxcin widgets — alle selectors beginnen met 'html body ' (zie Thema-guard). — Hero + USP-balk, Bestsellers, Marquee-balk.
 * Ontwerp: "Bioxcin Home - Hero - Bestsellers.dc.html" (1440 px) en "bioxcin-marquee-*.html".
 * Alles strikt gescoped (.bx-hero-wrap / .bx-bs / .bxt) zodat het Rey-thema en de widgets
 * elkaar niet raken. Kleuren en maten zijn CSS-variabelen die Elementor kan overschrijven.
 */

/* ==================================================================
   Gedeeld
   ================================================================== */
html body .bx-hero-wrap, html body .bx-bs {
	--bx-heading: #6E1A28;
	--bx-accent: #8B2332;
	--bx-accent-hover: #6E1A28;
	--bx-accent-soft: #F7E9EB;
	--bx-text: #5B4348;
	--bx-muted: #8A6E73;
	--bx-body: #2B1A1E;
	--bx-border: #EAD9DC;
	--bx-surface: #F8F3F3;
	--bx-white: #FFFFFF;
	--bx-maxw: 1440px;
	--bx-px: 80px;
	--bx-pt: 72px;

	font-family: 'Outfit', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
	font-size: 16px;
	line-height: 1.5;
	color: var(--bx-body);
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}
html body .bx-font-inherit, html body .bx-font-inherit * { font-family: inherit; }

/* ==================================================================
   Thema-guard (Rey / Elementor-kit)
   Rey en de Elementor-kit stylen h1-h6, label, input, button en .form-row
   globaal ('Rey Secondary' 48px, uppercase-labels, .form-row als flex,
   #customer_details als float). Daarom:
   1. krijgt elke selector in dit bestand 'html body ' ervoor (+1 specificiteit),
   2. zetten onderstaande basisregels de leidende eigenschappen terug op
      'inherit' binnen de widgets; de componentregels verderop winnen daarna
      op volgorde.
   ================================================================== */
html body .bx-hero-wrap, html body .bx-bs, html body .bxt, html body .bx-hd-wrap, html body .bx-sc, html body .bx-shop, html body .bx-ft-wrap, html body .bx-pp, html body .bx-hp, html body .bx-ar, html body .bx-bn, html body .bx-ig, html body .bx-cat { --h-text-transform: none; --u-text-transform: none; }
html body .bx-hero-wrap :where(h1, h2, h3, h4, h5, h6), html body .bx-bs :where(h1, h2, h3, h4, h5, h6), html body .bxt :where(h1, h2, h3, h4, h5, h6), html body .bx-hd-wrap :where(h1, h2, h3, h4, h5, h6), html body .bx-sc :where(h1, h2, h3, h4, h5, h6), html body .bx-shop :where(h1, h2, h3, h4, h5, h6), html body .bx-ft-wrap :where(h1, h2, h3, h4, h5, h6), html body .bx-pp :where(h1, h2, h3, h4, h5, h6), html body .bx-ar :where(h1, h2, h3, h4, h5, h6), html body .bx-bn :where(h1, h2, h3, h4, h5, h6), html body .bx-ig :where(h1, h2, h3, h4, h5, h6), html body .bx-cat :where(h1, h2, h3, h4, h5, h6) {
	margin: 0;
	font-family: inherit;
	color: inherit;
	letter-spacing: normal;
	text-transform: none;
	line-height: 1.2;
	word-break: normal;
}
html body .bx-hero-wrap label, html body .bx-bs label, html body .bxt label, html body .bx-hd-wrap label, html body .bx-sc label, html body .bx-shop label, html body .bx-ft-wrap label, html body .bx-pp label, html body .bx-ar label {
	margin: 0;
	font-family: inherit;
	font-size: inherit;
	font-weight: inherit;
	letter-spacing: normal;
	text-transform: none;
	color: inherit;
}
html body .bx-hero-wrap input:where(:not([type="checkbox"], [type="radio"], [type="submit"], [type="button"])), html body .bx-bs input:where(:not([type="checkbox"], [type="radio"], [type="submit"], [type="button"])), html body .bxt input:where(:not([type="checkbox"], [type="radio"], [type="submit"], [type="button"])), html body .bx-hd-wrap input:where(:not([type="checkbox"], [type="radio"], [type="submit"], [type="button"])), html body .bx-sc input:where(:not([type="checkbox"], [type="radio"], [type="submit"], [type="button"])), html body .bx-shop input:where(:not([type="checkbox"], [type="radio"], [type="submit"], [type="button"])), html body .bx-ft-wrap input:where(:not([type="checkbox"], [type="radio"], [type="submit"], [type="button"])), html body .bx-pp input:where(:not([type=\"checkbox\"], [type=\"radio\"], [type=\"submit\"], [type=\"button\"])), html body .bx-hero-wrap select, html body .bx-hero-wrap textarea, html body .bx-bs select, html body .bx-bs textarea, html body .bxt select, html body .bxt textarea, html body .bx-hd-wrap select, html body .bx-hd-wrap textarea, html body .bx-sc select, html body .bx-sc textarea, html body .bx-shop select, html body .bx-shop textarea, html body .bx-ft-wrap select, html body .bx-ft-wrap textarea, html body .bx-pp select, html body .bx-pp textarea {
	height: auto;
	min-height: 0;
	margin: 0;
	font-family: inherit;
	font-size: inherit;
	font-weight: inherit;
	line-height: normal;
	letter-spacing: normal;
	text-transform: none;
	color: inherit;
}
html body .bx-hero-wrap button, html body .bx-bs button, html body .bxt button, html body .bx-hd-wrap button, html body .bx-sc button, html body .bx-shop button, html body .bx-ft-wrap button, html body .bx-pp button, html body .bx-hp button, html body .bx-ar button, html body .bx-bn button, html body .bx-ig button, html body .bx-cat button, html body .bx-shop .button, html body .bx-shop .woocommerce-Button, html body .bx-shop input[type="submit"] {
	font-family: inherit;
	letter-spacing: normal;
	text-transform: none;
	text-decoration: none;
	line-height: 1.2;
}
html body .bx-hero-wrap ul, html body .bx-hero-wrap ol, html body .bx-bs ul, html body .bx-bs ol, html body .bxt ul, html body .bxt ol, html body .bx-hd-wrap ul, html body .bx-hd-wrap ol, html body .bx-sc ul, html body .bx-sc ol, html body .bx-shop ul, html body .bx-shop ol, html body .bx-ft-wrap ul, html body .bx-ft-wrap ol, html body .bx-pp ul, html body .bx-pp ol, html body .bx-hp ul, html body .bx-hp ol, html body .bx-ar ul, html body .bx-ar ol { margin: 0; padding: 0; list-style: none; }
html body .bx-shop form .form-row, html body .bx-shop .form-row, html body .bx-shop .form-row-wide, html body .bx-shop .form-row-first, html body .bx-shop .form-row-last {
	display: block;
	float: none;
	clear: none;
	width: 100%;
	max-width: none;
	margin: 0;
	padding: 0;
}
html body .bx-shop .form-row::before, html body .bx-shop .form-row::after { content: none; }
html body .bx-shop form .form-row label { display: block; margin: 0; font-size: inherit; font-weight: inherit; text-transform: none; letter-spacing: normal; color: inherit; }
html body .bx-shop form .form-row .required { visibility: visible; border: 0; }
html body .bx-shop .woocommerce-form__label-for-checkbox input[type="checkbox"] { display: inline-block !important; position: static; width: 16px; height: 16px; margin: 0 8px 0 0; accent-color: var(--bx-brand); vertical-align: middle; }
html body .bx-shop .woocommerce-form__label-for-checkbox input[type="checkbox"] + span::before, html body .bx-shop .woocommerce-form__label-for-checkbox input[type="checkbox"] + span::after, html body .bx-shop .woocommerce-form__label-for-checkbox input[type="checkbox"] + label::before, html body .bx-shop .woocommerce-form__label-for-checkbox input[type="checkbox"] + label::after { content: none; }
html body .bx-shop .woocommerce-form__label-for-checkbox input[type="checkbox"] + span { display: inline; padding: 0; font-size: inherit; font-weight: inherit; text-transform: none; }
html body .bx-shop .woocommerce-message .button, html body .bx-shop .woocommerce-error .button, html body .bx-shop .woocommerce-info .button { margin-left: auto; }

/* ------------------------------------------------------------------
   Volle breedte afdwingen. De widgets zijn paginabrede secties met hun eigen
   binnenbreedte (1440px). Staan ze in een "boxed" Elementor-container of
   -sectie, of in Rey's sitecontainer, dan halen we die begrenzing weg (CSS
   :has). Uitzondering: geef het widget in Elementor (Geavanceerd → CSS-classes)
   de class bx-keep-boxed.
   ------------------------------------------------------------------ */
html body .e-con:has(> .e-con-inner > .elementor-widget[class*="elementor-widget-bioxcin-"]:not(.bx-keep-boxed)),
html body .e-con:has(> .elementor-widget[class*="elementor-widget-bioxcin-"]:not(.bx-keep-boxed)) {
	--content-width: 100%;
	--padding-left: 0px;
	--padding-right: 0px;
	--padding-inline-start: 0px;
	--padding-inline-end: 0px;
	padding-left: 0 !important;
	padding-right: 0 !important;
}
html body .e-con:has(> .e-con-inner > .elementor-widget[class*="elementor-widget-bioxcin-"]:not(.bx-keep-boxed)) > .e-con-inner {
	width: 100%;
	max-width: none !important;
	padding-left: 0 !important;
	padding-right: 0 !important;
}
html body .elementor-section:has(> .elementor-container > .elementor-column > .elementor-widget-wrap > .elementor-widget[class*="elementor-widget-bioxcin-"]:not(.bx-keep-boxed)) > .elementor-container {
	max-width: none !important;
}
html body .elementor-column:has(> .elementor-widget-wrap > .elementor-widget[class*="elementor-widget-bioxcin-"]:not(.bx-keep-boxed)) > .elementor-widget-wrap {
	padding: 0 !important;
}
html body .elementor-widget[class*="elementor-widget-bioxcin-"]:not(.bx-keep-boxed) {
	width: 100%;
	max-width: none;
}
html body .rey-siteContainer:has(.elementor-widget[class*="elementor-widget-bioxcin-"]:not(.bx-keep-boxed)),
html body .rey-siteContainer:has(.bx-hero-wrap, .bx-bs, .bxt, .bx-hd-wrap, .bx-shop, .bx-ft-wrap, .bx-pp, .bx-ar, .bx-bn, .bx-ig, .bx-cat) {
	max-width: none !important;
	padding-left: 0 !important;
	padding-right: 0 !important;
}
html body .rey-siteContainer:has(.elementor-widget[class*="elementor-widget-bioxcin-"]:not(.bx-keep-boxed)) :is(.rey-siteMain, .rey-siteMain-inner, .rey-siteContent, .rey-pageContent),
html body .rey-siteContainer:has(.bx-hero-wrap, .bx-bs, .bxt, .bx-hd-wrap, .bx-shop, .bx-ft-wrap, .bx-pp, .bx-ar, .bx-bn, .bx-ig, .bx-cat) :is(.rey-siteMain, .rey-siteMain-inner, .rey-siteContent, .rey-pageContent) {
	width: 100%;
	max-width: none !important;
	margin-left: 0 !important;
	margin-right: 0 !important;
	padding-left: 0 !important;
	padding-right: 0 !important;
}

html body .bx-hero-wrap *, html body .bx-hero-wrap *::before, html body .bx-hero-wrap *::after, html body .bx-bs *, html body .bx-bs *::before, html body .bx-bs *::after, html body .bxt *, html body .bxt *::before, html body .bxt *::after { box-sizing: border-box; }

html body .bx-hero-wrap h1, html body .bx-hero-wrap h2, html body .bx-hero-wrap h3, html body .bx-hero-wrap p, html body .bx-bs h1, html body .bx-bs h2, html body .bx-bs h3, html body .bx-bs p { margin: 0; padding: 0; }

html body .bx-accent { color: var(--bx-accent); }

html body .bx-stars {
	color: var(--bx-accent);
	letter-spacing: 2px;
	white-space: nowrap;
	font-family: 'Outfit', 'Segoe UI Symbol', 'Apple Symbols', Arial, sans-serif;
}
html body .bx-stars__empty { color: #E4CDD1; }

html body .bx-notice {
	margin: 12px 0;
	padding: 14px 18px;
	border: 1px dashed #E4CDD1;
	border-radius: 12px;
	background: #F8F3F3;
	color: #5B4348;
	font-size: 13px;
	text-align: center;
}

/* Knoppen (pill) */
html body .bx-hero-wrap .bx-btn, html body .bx-bs .bx-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	margin: 0;
	border: 0;
	border-radius: 999px;
	padding: 16px 28px;
	font-family: inherit;
	font-size: 14px;
	font-weight: 600;
	line-height: 1.2;
	letter-spacing: 0;
	text-transform: none;
	text-decoration: none !important;
	white-space: nowrap;
	cursor: pointer;
	box-shadow: none;
	transition: background-color .2s ease, color .2s ease, border-color .2s ease;
	-webkit-appearance: none;
	appearance: none;
}
html body .bx-hero-wrap .bx-btn--primary, html body .bx-bs .bx-btn--primary {
	background: var(--bx-accent);
	color: var(--bx-white) !important;
}
html body .bx-hero-wrap .bx-btn--primary:hover, html body .bx-bs .bx-btn--primary:hover, html body .bx-hero-wrap .bx-btn--primary:focus-visible, html body .bx-bs .bx-btn--primary:focus-visible {
	background: var(--bx-accent-hover);
	color: var(--bx-white) !important;
}
html body .bx-hero-wrap .bx-btn--ghost {
	border: 1.5px solid var(--bx-accent);
	background: transparent;
	color: var(--bx-accent) !important;
	padding: 14.5px 26.5px; /* 16/28 minus de rand: zelfde buitenmaat als de primaire knop */
}
html body .bx-hero-wrap .bx-btn--ghost:hover, html body .bx-hero-wrap .bx-btn--ghost:focus-visible {
	background: var(--bx-accent-soft);
	color: var(--bx-accent) !important;
}
html body .bx-bs .bx-btn--sm { padding: 10px 16px; font-size: 12px; }
html body .bx-bs .bx-btn.is-disabled { opacity: .5; cursor: default; pointer-events: none; }
html body .bx-bs .bx-btn.is-loading { opacity: .75; pointer-events: none; }
html body .bx-bs .bx-btn.is-added { background: var(--bx-accent-hover); }

/* ==================================================================
   Hero
   ================================================================== */
html body .bx-hero-wrap {
	--bx-bg: #F8F3F3;
	--bx-usp-bg: #FFFFFF;
	--bx-card-dark: #6E1A28;
	--bx-img-h: 568px;
	--bx-vh-offset: 0px;  /* handmatige aftrek (Elementor) */
	--bx-top-offset: 0px; /* gemeten ruimte boven de hero (JS) */
}

html body .bx-hero { background: var(--bx-bg); }

html body .bx-hero__inner {
	max-width: var(--bx-maxw);
	margin: 0 auto;
	padding: var(--bx-pt) var(--bx-px) 0;
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
	gap: 48px;
	align-items: end;
	min-height: calc(var(--bx-pt) + var(--bx-img-h));
}

html body .bx-hero__text {
	padding-bottom: 72px;
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 24px;
}

html body .bx-hero-wrap .bx-hero__title {
	font-size: 66px;
	font-weight: 700;
	line-height: 1;
	letter-spacing: -.02em;
	color: var(--bx-heading);
	text-wrap: pretty;
}

html body .bx-hero-wrap .bx-hero__intro {
	font-size: 17px;
	line-height: 1.65;
	color: var(--bx-text);
	max-width: 520px;
}

html body .bx-hero__actions {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 12px;
}

html body .bx-hero__rating {
	display: flex;
	align-items: center;
	gap: 12px;
	font-size: 13px;
	color: var(--bx-text);
}
html body .bx-hero__rating b { color: var(--bx-heading); font-weight: 700; }
html body .bx-hero__rating > span:not(.bx-stars) { color: var(--bx-muted); }

/* Foto + zwevende kaarten */
html body .bx-hero__media {
	position: relative;
	height: var(--bx-img-h);
}
html body .bx-hero__image {
	position: absolute;
	inset: 0;
	border-radius: 24px 24px 0 0;
	overflow: hidden;
	background: var(--bx-card-dark);
}
html body .bx-hero__image .bx-hero__img {
	display: block;
	width: 100%;
	height: 100%;
	max-width: none;
	object-fit: cover;
	border-radius: 0;
}
html body .bx-placeholder {
	position: absolute;
	inset: 0;
	display: grid;
	place-items: center;
	padding: 20px;
	text-align: center;
	font-size: 13px;
	color: rgba(255, 255, 255, .75);
}

html body .bx-hero__card {
	position: absolute;
	border-radius: 16px;
	z-index: 2;
}
html body .bx-hero__card--info {
	left: -40px;
	top: 64px;
	width: 230px;
	padding: 20px 22px;
	background: var(--bx-card-dark);
	color: #fff;
	box-shadow: 0 16px 40px rgba(110, 26, 40, .25);
}
html body .bx-hero__card-eyebrow {
	font-size: 11px;
	font-weight: 600;
	letter-spacing: .12em;
	text-transform: uppercase;
	color: #F1C9CF;
}
html body .bx-hero__card-number {
	margin-top: 8px;
	font-size: 36px;
	font-weight: 700;
	line-height: 1;
}
html body .bx-hero__card-text {
	margin-top: 4px;
	font-size: 12px;
	line-height: 1.5;
	color: #F5DFE2;
}

html body .bx-hero__card--product {
	right: 24px;
	bottom: 24px;
	width: 320px;
	padding: 14px 16px;
	display: flex;
	align-items: center;
	gap: 14px;
	background: var(--bx-white);
	color: var(--bx-body);
	box-shadow: 0 16px 40px rgba(110, 26, 40, .18);
}
html body .bx-hero__card--product.is-sample { outline: 1px dashed #E4CDD1; }
html body .bx-hero__card-thumb {
	flex: none;
	width: 56px;
	height: 56px;
	border-radius: 10px;
	background: var(--bx-surface);
	overflow: hidden;
	display: grid;
	place-items: center;
}
html body .bx-hero__card-thumb .bx-hero__card-img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: contain;
}
html body .bx-hero__card-body { flex: 1; min-width: 0; }
html body .bx-hero__card-tag {
	font-size: 10px;
	font-weight: 600;
	letter-spacing: .1em;
	text-transform: uppercase;
	color: var(--bx-accent);
}
html body .bx-hero__card-name {
	margin-top: 2px;
	font-size: 13px;
	font-weight: 600;
	line-height: 1.25;
	color: var(--bx-heading);
}
html body .bx-hero__card-name a { color: inherit; text-decoration: none; }
html body .bx-hero__card-name a:hover { color: var(--bx-accent); }
html body .bx-hero__card-price { margin-top: 3px; font-size: 12px; }
html body .bx-hero__card-price b { font-weight: 700; }
html body .bx-hero__card-was {
	margin-left: 4px;
	color: var(--bx-muted);
	text-decoration: line-through;
}
html body .bx-hero__card-price .amount, html body .bx-bs .amount { font-size: inherit; color: inherit; font-weight: inherit; }
html body .bx-hero-wrap .bx-hero__card-arrow {
	flex: none;
	width: 34px;
	height: 34px;
	border-radius: 50%;
	background: var(--bx-accent);
	color: #fff;
	display: grid;
	place-items: center;
	text-decoration: none;
	transition: background-color .2s ease;
}
html body .bx-hero-wrap .bx-hero__card-arrow:hover { background: var(--bx-accent-hover); color: #fff; }
html body .bx-hero__card-arrow svg { width: 15px; height: 15px; display: block; }

/* USP-balk: 1px lijnen via grid-gap, lijn onder de hele balk */
html body .bx-usps {
	background: var(--bx-usp-bg);
	border-bottom: 1px solid var(--bx-border);
}
html body .bx-usps__inner {
	max-width: var(--bx-maxw);
	margin: 0 auto;
	display: grid;
	grid-template-columns: repeat(var(--bx-usp-cols, 4), minmax(0, 1fr));
	gap: 1px;
	background: var(--bx-border);
}
html body .bx-hero-wrap .bx-usps__item {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 6px;
	padding: 20px 12px;
	background: var(--bx-usp-bg);
	text-align: center;
	font-size: 12px;
	font-weight: 500;
	line-height: 1.4;
	color: var(--bx-body);
	text-decoration: none;
}
html body .bx-hero-wrap a.bx-usps__item:hover { color: var(--bx-accent); }
html body .bx-usps__icon {
	display: inline-flex;
	align-items: center;
	flex: none;
	color: var(--bx-accent);
	font-size: 14px;
	line-height: 1;
}
html body .bx-usps__icon svg { width: 14px; height: 14px; display: block; fill: currentColor; }
html body .bx-usps__icon i { font-size: 14px; }

/* Volledige schermhoogte
   --screen:      hero + USP-balk vullen samen het scherm (grid 1fr/auto; min-height rekt de fr-rij op)
   --screen-hero: alleen de hero vult het scherm, de USP-balk staat eronder
   In beide gevallen rekt de foto mee tot de onderrand en wordt de tekst verticaal gecentreerd. */
html body .bx-hero-wrap--screen {
	display: grid;
	grid-template-rows: minmax(0, 1fr) auto;
	min-height: calc(100vh - var(--bx-vh-offset) - var(--bx-top-offset));
	min-height: calc(100svh - var(--bx-vh-offset) - var(--bx-top-offset));
}
html body .bx-hero-wrap--screen-hero .bx-hero {
	min-height: calc(100vh - var(--bx-vh-offset) - var(--bx-top-offset));
	min-height: calc(100svh - var(--bx-vh-offset) - var(--bx-top-offset));
}
html body .bx-hero-wrap--screen .bx-hero, html body .bx-hero-wrap--screen-hero .bx-hero {
	display: grid;
	grid-template-rows: minmax(0, 1fr);
}
html body .bx-hero-wrap--screen .bx-hero__inner, html body .bx-hero-wrap--screen-hero .bx-hero__inner {
	min-height: 0;
	width: 100%;
	grid-template-rows: minmax(0, 1fr);
	align-items: stretch;
}
html body .bx-hero-wrap--screen .bx-hero__text, html body .bx-hero-wrap--screen-hero .bx-hero__text {
	align-self: center;
	padding-top: 24px;
	padding-bottom: 48px;
}
html body .bx-hero-wrap--screen .bx-hero__media, html body .bx-hero-wrap--screen-hero .bx-hero__media {
	height: auto;
	min-height: 420px;
	align-self: stretch;
}

/* Responsive hero */
@media (max-width: 1024px) {
	html body .bx-hero-wrap { --bx-px: 40px; --bx-pt: 56px; }
	html body .bx-hero__inner {
		grid-template-columns: minmax(0, 1fr);
		gap: 40px;
		min-height: 0;
	}
	html body .bx-hero__text { padding-bottom: 0; }
	html body .bx-hero-wrap .bx-hero__title { font-size: 48px; }
	html body .bx-hero__media {
		height: auto;
		aspect-ratio: 4 / 3;
		min-height: 320px;
	}
	html body .bx-hero__card--info { left: 16px; top: 16px; }

	/* Volledige schermhoogte, gestapeld: tekst bovenaan, foto vult de rest */
	html body .bx-hero-wrap--screen .bx-hero__inner, html body .bx-hero-wrap--screen-hero .bx-hero__inner {
		grid-template-rows: auto minmax(320px, 1fr);
	}
	html body .bx-hero-wrap--screen .bx-hero__text, html body .bx-hero-wrap--screen-hero .bx-hero__text {
		align-self: start;
		padding-top: 0;
		padding-bottom: 0;
	}
	html body .bx-hero-wrap--screen .bx-hero__media, html body .bx-hero-wrap--screen-hero .bx-hero__media {
		aspect-ratio: auto;
		min-height: 320px;
	}
}
@media (max-width: 767px) {
	html body .bx-hero-wrap { --bx-px: 20px; --bx-pt: 40px; }
	html body .bx-hero__text { gap: 18px; }
	html body .bx-hero-wrap .bx-hero__title { font-size: 38px; }
	html body .bx-hero-wrap .bx-hero__intro { font-size: 16px; }
	html body .bx-hero__media { aspect-ratio: 1 / 1; min-height: 0; }
	html body .bx-hero__card--info { width: 190px; padding: 14px 16px; }
	html body .bx-hero__card-number { font-size: 28px; }
	html body .bx-hero__card--product {
		left: 12px;
		right: 12px;
		bottom: 12px;
		width: auto;
	}
	html body .bx-usps__inner { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	html body .bx-hero-wrap .bx-usps__item { padding: 16px 10px; }
}
@media (max-width: 420px) {
	html body .bx-usps__inner { grid-template-columns: minmax(0, 1fr); }
}

/* ==================================================================
   Bestsellers (carrousel die rechts doorloopt tot de schermrand)
   ================================================================== */
html body .bx-bs {
	--bx-bg: #FFFFFF;
	--bx-card-bg: #FFFFFF;
	--bx-img-bg: #FFFFFF; /* afbeeldingsvak: wit, zodat foto's die niet passen geen lichtblauwe randen krijgen */
	--bx-cols: 4;
	--bx-gap: 20px;
	--bx-img-h: 240px;
	--bx-pb: 56px;
	--bx-bleed: 0px; /* wordt door JS gezet: afstand container-rand → schermrand */

	background: var(--bx-bg);
}

html body .bx-bs__inner {
	max-width: var(--bx-maxw);
	margin: 0 auto;
	padding: var(--bx-pt) var(--bx-px) var(--bx-pb);
}
html body .bx-bs__body { container-type: inline-size; }

html body .bx-bs__head {
	display: flex;
	justify-content: space-between;
	align-items: flex-end;
	gap: 16px;
	margin-bottom: 28px;
}
html body .bx-bs__eyebrow {
	font-size: 12px;
	font-weight: 600;
	letter-spacing: .14em;
	text-transform: uppercase;
	color: var(--bx-accent);
}
html body .bx-bs .bx-bs__title {
	margin-top: 6px;
	font-size: 36px;
	font-weight: 700;
	line-height: 1.2;
	color: var(--bx-heading);
}
html body .bx-bs__nav { display: flex; gap: 10px; flex: none; }
html body .bx-bs .bx-bs__arrow {
	width: 44px;
	height: 44px;
	margin: 0;
	padding: 0;
	border-radius: 50%;
	border: 1.5px solid var(--bx-accent);
	background: var(--bx-white);
	color: var(--bx-accent);
	display: grid;
	place-items: center;
	cursor: pointer;
	box-shadow: none;
	transition: background-color .2s ease, color .2s ease, border-color .2s ease, opacity .2s ease;
}
html body .bx-bs .bx-bs__arrow--next { background: var(--bx-accent); color: var(--bx-white); }
html body .bx-bs .bx-bs__arrow:hover, html body .bx-bs .bx-bs__arrow:focus-visible {
	background: var(--bx-accent-hover);
	border-color: var(--bx-accent-hover);
	color: var(--bx-white);
}
html body .bx-bs .bx-bs__arrow[disabled] { opacity: .35; cursor: default; }
html body .bx-bs__arrow svg { width: 16px; height: 16px; display: block; }

/* Scrollgebied: loopt rechts door (negatieve marge = bleed) en laat ruimte voor de hover-schaduw */
html body .bx-bs__viewport {
	overflow-x: auto;
	overflow-y: hidden;
	margin: -20px 0 -44px -40px;
	margin-right: calc(-1 * var(--bx-bleed));
	padding: 20px 0 44px 40px;
	scroll-snap-type: x proximity;
	scroll-padding-left: 40px;
	scrollbar-width: none;
	-ms-overflow-style: none;
	overscroll-behavior-x: contain;
	-webkit-overflow-scrolling: touch;
}
html body .bx-bs__viewport::-webkit-scrollbar { display: none; }

html body .bx-bs__track {
	display: flex;
	gap: var(--bx-gap);
	width: max-content;
	padding-right: var(--bx-bleed); /* laatste kaart eindigt op de container-rand */
}

html body .bx-bs__card {
	flex: none;
	width: calc((100cqw - (var(--bx-cols) - 1) * var(--bx-gap)) / var(--bx-cols));
	scroll-snap-align: start;
	position: relative;
	display: flex;
	flex-direction: column;
	padding: 16px;
	border: 1px solid var(--bx-border);
	border-radius: 16px;
	background: var(--bx-card-bg);
	transition: box-shadow .25s ease, border-color .25s ease;
}
@supports not (width: 1cqw) {
	html body .bx-bs__track { width: auto; }
	html body .bx-bs__card { width: calc((100% - (var(--bx-cols) - 1) * var(--bx-gap)) / var(--bx-cols)); }
}
html body .bx-bs__card:hover {
	box-shadow: 0 14px 36px rgba(110, 26, 40, .12);
	border-color: var(--bx-card-bg);
}

html body .bx-bs__badge {
	position: absolute;
	top: 26px;
	left: 26px;
	z-index: 1;
	padding: 4px 10px;
	border-radius: 999px;
	background: var(--bx-accent);
	color: var(--bx-white);
	font-size: 11px;
	font-weight: 600;
	line-height: 1.4;
	white-space: nowrap;
}

html body .bx-bs .bx-bs__wish {
	--icon-fill: none;
	position: absolute;
	top: 24px;
	right: 24px;
	z-index: 1;
	width: 32px;
	height: 32px;
	margin: 0;
	padding: 0;
	border-radius: 50%;
	border: 1px solid var(--bx-border);
	background: var(--bx-white);
	color: var(--bx-accent);
	display: grid;
	place-items: center;
	cursor: pointer;
	box-shadow: none;
	opacity: 1;
	transition: border-color .2s ease, transform .2s ease;
}
html body .bx-bs .bx-bs__wish:hover { border-color: var(--bx-accent); }
html body .bx-bs .bx-bs__wish.--in-wishlist { --icon-fill: currentColor; }
html body .bx-bs .bx-bs__wish.--animate { transform: scale(.85); }
html body .bx-bs__wish svg { width: 14px; height: 14px; display: block; }

html body .bx-bs .bx-bs__media {
	display: block;
	height: var(--bx-img-h);
	border-radius: 12px;
	background: var(--bx-img-bg);
	overflow: hidden;
}
html body .bx-bs__media .bx-bs__img {
	display: block;
	width: 100%;
	height: 100%;
	max-width: none;
	object-fit: var(--bx-img-fit, cover);
	object-position: center;
	border-radius: 0;
}

html body .bx-bs__cat {
	margin-top: 14px;
	font-size: 11px;
	font-weight: 500;
	color: var(--bx-accent);
}
html body .bx-bs .bx-bs__name {
	margin-top: 14px;
	font-size: 15px;
	font-weight: 600;
	line-height: 1.35;
	color: var(--bx-heading);
}
html body .bx-bs__cat + .bx-bs__name { margin-top: 4px; }
html body .bx-bs .bx-bs__name a { color: inherit; text-decoration: none; }
html body .bx-bs .bx-bs__name a:hover { color: var(--bx-accent); }
html body .bx-bs .bx-bs__desc {
	flex: 1;
	margin-top: 6px;
	font-size: 12px;
	line-height: 1.6;
	color: var(--bx-muted);
}
html body .bx-bs__spacer { flex: 1; }
html body .bx-bs__reviews {
	display: flex;
	align-items: center;
	gap: 6px;
	margin-top: 10px;
	font-size: 11px;
	color: var(--bx-muted);
}
html body .bx-bs__reviews .bx-stars { letter-spacing: 1px; }

html body .bx-bs__foot {
	display: flex;
	justify-content: space-between;
	align-items: center;
	gap: 8px;
	margin-top: 12px;
}
html body .bx-bs__prices {
	display: flex;
	align-items: baseline;
	flex-wrap: wrap;
	gap: 8px;
	min-width: 0;
}
html body .bx-bs__was {
	font-size: 12px;
	color: var(--bx-muted);
	text-decoration: line-through;
}
html body .bx-bs .bx-bs__price {
	font-size: 17px;
	font-weight: 700;
	color: var(--bx-heading);
}

/* Responsive bestsellers (Elementor-instellingen per apparaat gaan hierboven) */
@media (max-width: 1024px) {
	html body .bx-bs { --bx-px: 40px; --bx-pt: 56px; --bx-pb: 40px; --bx-cols: 2.5; }
	html body .bx-bs .bx-bs__title { font-size: 30px; }
}
@media (max-width: 767px) {
	html body .bx-bs { --bx-px: 20px; --bx-pt: 40px; --bx-pb: 32px; --bx-cols: 1.3; }
	html body .bx-bs .bx-bs__title { font-size: 26px; }
	html body .bx-bs__head { margin-bottom: 20px; }
	html body .bx-bs .bx-bs__arrow { width: 40px; height: 40px; }
	html body .bx-bs__viewport { margin-left: -20px; padding-left: 20px; scroll-padding-left: 20px; }
}

/* ==================================================================
   Marquee-balk (bxt) — origineel: bioxcin-marquee-donker/licht.html
   ================================================================== */
html body .bxt {
	--bxt-bg: #7E1F2F;
	--bxt-bg-deep: #6E1A28;
	--bxt-glow: rgba(232, 180, 190, .22);
	--bxt-text: rgba(255, 255, 255, .86);
	--bxt-accent: #F1C9CF;
	--bxt-sep: rgba(241, 201, 207, .55);
	--bxt-line: rgba(255, 255, 255, .10);
	--bxt-gap: 56px;
	--bxt-speed: 44s;
	--bxt-py: 11px;

	position: relative;
	width: 100%;
	overflow: hidden;
	background:
		radial-gradient(60% 140% at 50% 120%, var(--bxt-glow), transparent 70%),
		linear-gradient(90deg, var(--bxt-bg-deep) 0%, var(--bxt-bg) 35%, var(--bxt-bg) 65%, var(--bxt-bg-deep) 100%);
	border-bottom: 1px solid var(--bxt-line);
	font-family: 'Outfit', system-ui, sans-serif;
	color: var(--bxt-text);
	-webkit-font-smoothing: antialiased;
}
html body .bxt.bxt--light {
	--bxt-bg: #F8F3F3;
	--bxt-bg-deep: #F1E4E6;
	--bxt-glow: rgba(139, 35, 50, .10);
	--bxt-text: #2B1A1E;
	--bxt-accent: #7E1F2F;
	--bxt-sep: rgba(139, 35, 50, .45);
	--bxt-line: rgba(139, 35, 50, .12);
}

/* rail met fade aan beide zijden */
html body .bxt__rail {
	position: relative;
	width: 100%;
	overflow: hidden;
	-webkit-mask-image: linear-gradient(90deg, transparent 0, #000 7%, #000 93%, transparent 100%);
	        mask-image: linear-gradient(90deg, transparent 0, #000 7%, #000 93%, transparent 100%);
}
html body .bxt--nofade .bxt__rail {
	-webkit-mask-image: none;
	        mask-image: none;
}

/* de bewegende strook: inhoud staat er (minstens) twee keer in, loop is -50% */
html body .bxt__track {
	display: flex;
	align-items: center;
	width: max-content;
	padding: var(--bxt-py) 0;
	animation: bxtScroll var(--bxt-speed) linear infinite;
	will-change: transform;
}
html body .bxt__set {
	display: flex;
	align-items: center;
	flex: none;
}
html body .bxt.bxt--pause:hover .bxt__track, html body .bxt.bxt--pause:focus-within .bxt__track { animation-play-state: paused; }

@keyframes bxtScroll {
	from { transform: translate3d(0, 0, 0); }
	to   { transform: translate3d(-50%, 0, 0); }
}

/* een item = tekst + scheidingsteken, met de gap erin verwerkt */
html body .bxt .bxt__i {
	display: inline-flex;
	align-items: center;
	gap: var(--bxt-gap);
	padding-right: var(--bxt-gap);
	margin: 0;
	white-space: nowrap;
	font-family: inherit;
	font-size: 12px;
	font-weight: 500;
	letter-spacing: .06em;
	line-height: 1;
	color: inherit;
	text-decoration: none;
}
html body .bxt .bxt__i--acc {
	font-family: inherit;
	font-size: 13px;
	font-weight: 600;
	letter-spacing: .04em;
	color: var(--bxt-accent);
}
html body .bxt.bx-font-inherit .bxt__i, html body .bxt.bx-font-inherit .bxt__i--acc { font-family: inherit; }

/* scheidingsteken: kleine druppel */
html body .bxt__sep {
	flex: none;
	width: 8px;
	height: 11px;
	color: var(--bxt-sep);
	display: inline-flex;
	align-items: center;
	justify-content: center;
}
html body .bxt__sep--sparkle { width: 11px; height: 11px; }
html body .bxt__sep svg { display: block; width: 100%; height: 100%; fill: currentColor; }
html body .bxt__sep i { font-size: 10px; line-height: 1; }

html body .bxt a:focus-visible { outline: 2px solid var(--bxt-accent); outline-offset: 3px; border-radius: 2px; }

@media (max-width: 767px) {
	html body .bxt { --bxt-gap: 34px; --bxt-speed: 30s; --bxt-py: 9px; }
	html body .bxt .bxt__i { font-size: 11px; letter-spacing: .05em; }
	html body .bxt .bxt__i--acc { font-size: 12px; }
}

@media (prefers-reduced-motion: reduce) {
	html body .bxt__track { animation: none; }
	html body .bxt__rail {
		overflow-x: auto;
		-webkit-mask-image: none;
		        mask-image: none;
	}
}

/* ==================================================================
   Header (bx-hd) — ontwerp: Bioxcin Header.html
   ================================================================== */
html body .bx-hd-wrap {
	--bx-heading: #6E1A28;
	--bx-accent: #8B2332;
	--bx-accent-soft: #F7E9EB;
	--bx-body: #2B1A1E;
	--bx-muted: #8A6E73;
	--bx-border: #EAD9DC;
	--bx-surface: #F8F3F3;
	--bx-white: #FFFFFF;
	--bx-maxw: 1440px;
	--bx-px: 56px;
	--bx-hd-h: 84px;
	--bx-hd-logo-h: 48px;
	--bx-hd-badge: #4E9A51;

	position: relative;
	z-index: 90;
	font-family: 'Outfit', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
	font-size: 14px;
	line-height: 1.5;
	color: var(--bx-body);
	-webkit-font-smoothing: antialiased;
}
html body .bx-hd-wrap *, html body .bx-hd-wrap *::before, html body .bx-hd-wrap *::after { box-sizing: border-box; }
html body .bx-hd-wrap p { margin: 0; }
html body .bx-hd-wrap [hidden] { display: none !important; }
html body .bx-hd-wrap button {
	font-family: inherit;
	cursor: pointer;
	-webkit-appearance: none;
	appearance: none;
}
html body .bx-hd-wrap a { text-decoration: none; }

html body .bx-hd {
	position: relative;
	background: var(--bx-white);
	border-bottom: 1px solid var(--bx-border);
}
html body .bx-hd__inner {
	max-width: var(--bx-maxw);
	margin: 0 auto;
	padding: 0 var(--bx-px);
	height: var(--bx-hd-h);
	display: grid;
	grid-template-columns: 1fr auto 1fr;
	column-gap: 32px;
	align-items: center;
}

/* Logo */
html body .bx-hd__logo { justify-self: start; display: block; line-height: 0; }
/* !important: Elementor (.elementor img{height:auto;max-width:100%}) en thema-regels zijn specifieker dan deze class. */
html body .bx-hd-wrap .bx-hd__logo-img {
	display: block;
	height: var(--bx-hd-logo-h) !important;
	min-height: 0 !important;
	max-height: none !important;
	width: auto !important;
	max-width: none !important;
	object-fit: contain;
}

/* Menu */
html body .bx-hd__nav {
	display: flex;
	align-items: center;
	gap: 4px;
	height: var(--bx-hd-h);
	white-space: nowrap;
}
html body .bx-hd-wrap .bx-hd__link {
	display: flex;
	align-items: center;
	padding: 10px 12px;
	border-radius: 999px;
	font-size: 13px;
	font-weight: 500;
	line-height: 1.2;
	color: var(--bx-body);
	transition: background-color .15s ease, color .15s ease;
}
html body .bx-hd-wrap .bx-hd__link:hover { color: var(--bx-accent); }
html body .bx-hd-wrap .bx-hd__link.is-active, html body .bx-hd-wrap .bx-hd__link.is-open {
	font-weight: 600;
	color: var(--bx-accent);
	background: var(--bx-accent-soft);
}
html body .bx-hd__chev {
	display: inline-flex;
	margin-left: 5px;
	opacity: .7;
}

/* Acties */
html body .bx-hd__actions {
	display: flex;
	align-items: center;
	gap: 10px;
	justify-self: end;
}

/* Zoekveld */
html body .bx-hd__search { position: relative; }
html body .bx-hd__search-box {
	display: flex;
	align-items: center;
	gap: 6px;
	height: 44px;
	width: 200px;
	margin: 0;
	padding: 0 6px 0 16px;
	border-radius: 999px;
	border: 1px solid transparent;
	background: var(--bx-surface);
	transition: width .2s ease, border-color .2s ease;
}
html body .bx-hd__search.is-open .bx-hd__search-box {
	width: 300px;
	border-color: var(--bx-accent);
}
html body .bx-hd-wrap .bx-hd__search-input {
	flex: 1;
	min-width: 0;
	height: 100%;
	margin: 0;
	padding: 0;
	border: 0;
	border-radius: 0;
	background: transparent;
	box-shadow: none;
	outline: none;
	font-family: inherit;
	font-size: 13px;
	color: var(--bx-body);
}
html body .bx-hd-wrap .bx-hd__search-input::placeholder { color: var(--bx-muted); opacity: 1; }
html body .bx-hd-wrap .bx-hd__search-input::-webkit-search-cancel-button { display: none; }
html body .bx-hd-wrap .bx-hd__search-clear {
	border: 0;
	background: none;
	color: var(--bx-muted);
	font-size: 14px;
	line-height: 1;
	padding: 0 4px;
}
html body .bx-hd-wrap .bx-hd__search-btn {
	flex: none;
	width: 32px;
	height: 32px;
	padding: 0;
	border: 0;
	border-radius: 50%;
	background: var(--bx-accent);
	color: #fff;
	display: grid;
	place-items: center;
}
html body .bx-hd-wrap .bx-hd__search-btn:hover { background: var(--bx-heading); }

/* Winkelwagen */
html body .bx-hd-wrap .bx-hd__cart {
	position: relative;
	display: flex;
	align-items: center;
	gap: 8px;
	height: 44px;
	padding: 0 18px 0 14px;
	border: 0;
	border-radius: 999px;
	background: var(--bx-accent);
	color: #fff !important;
	font-size: 13px;
	font-weight: 600;
	line-height: 1;
	transition: background-color .15s ease;
}
html body .bx-hd-wrap .bx-hd__cart:hover { background: var(--bx-heading); }
html body .bx-hd__cart svg { flex: none; }
html body .bx-hd__cart-total .amount { color: inherit; font-size: inherit; font-weight: inherit; }
html body .bx-hd__cart-count {
	position: absolute;
	top: -4px;
	right: -4px;
	min-width: 20px;
	height: 20px;
	padding: 0 5px;
	border: 2px solid #fff;
	border-radius: 999px;
	background: var(--bx-hd-badge);
	color: #fff;
	font-size: 11px;
	font-weight: 700;
	display: grid;
	place-items: center;
}
html body .bx-hd__cart-count[data-count="0"] { display: none; }

/* Burger (alleen mobiel) */
html body .bx-hd-wrap .bx-hd__burger {
	display: none;
	width: 44px;
	height: 44px;
	padding: 10px;
	border: 1px solid var(--bx-border);
	border-radius: 50%;
	background: #fff;
	flex-direction: column;
	justify-content: center;
	gap: 5px;
}
html body .bx-hd__burger span {
	display: block;
	height: 2px;
	border-radius: 2px;
	background: var(--bx-heading);
	transition: transform .2s ease, opacity .2s ease;
}
html body .bx-hd__burger.is-open span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
html body .bx-hd__burger.is-open span:nth-child(2) { opacity: 0; }
html body .bx-hd__burger.is-open span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }

/* Megamenu */
html body .bx-hd__mega {
	position: absolute;
	top: 100%;
	left: 0;
	right: 0;
	z-index: 45;
	background: #fff;
	border-bottom: 1px solid var(--bx-border);
	box-shadow: 0 24px 64px rgba(110, 26, 40, .14);
}
html body .bx-hd__mega-inner {
	max-width: var(--bx-maxw);
	margin: 0 auto;
	padding: 32px var(--bx-px);
	display: grid;
	grid-template-columns: repeat(var(--bx-mega-cols, 3), minmax(0, 1fr));
	gap: 0 28px;
}
html body .bx-hd__mega-inner.has-promo { grid-template-columns: repeat(var(--bx-mega-cols, 3), minmax(0, 1fr)) 340px; }
html body .bx-hd__col--sep {
	border-left: 1px solid var(--bx-border);
	padding-left: 28px;
}
html body .bx-hd__col-title {
	font-size: 17px;
	font-weight: 600;
	color: var(--bx-accent);
}
html body .bx-hd__col-sub {
	margin-top: 4px;
	max-width: 210px;
	font-size: 13px;
	line-height: 1.5;
	color: var(--bx-muted);
}
html body .bx-hd__col-links {
	display: flex;
	flex-direction: column;
	gap: 2px;
	margin-top: 22px;
}
html body .bx-hd-wrap .bx-hd__col-link {
	display: flex;
	align-items: center;
	gap: 12px;
	padding: 8px 8px 8px 0;
	border-radius: 8px;
	font-size: 14px;
	color: var(--bx-body);
}
html body .bx-hd-wrap .bx-hd__col-link > span:first-child { flex: 1; }
html body .bx-hd-wrap .bx-hd__col-link:hover { color: var(--bx-accent); }
html body .bx-hd__count { font-size: 12px; color: var(--bx-muted); }
html body .bx-hd__tag {
	padding: 4px 10px;
	border-radius: 999px;
	background: var(--bx-accent-soft);
	color: var(--bx-heading);
	font-size: 10px;
	font-weight: 700;
	letter-spacing: .06em;
}
html body .bx-hd-wrap .bx-hd__col-all {
	display: flex;
	align-items: center;
	gap: 6px;
	padding: 10px 0;
	font-size: 14px;
	font-weight: 600;
	color: var(--bx-accent);
}
html body .bx-hd__promo {
	--bx-promo-ov1: rgba(110, 26, 40, .88);
	--bx-promo-ov2: rgba(139, 35, 50, .72);
	--bx-promo-pos: center;

	position: relative;
	overflow: hidden;
	display: flex;
	flex-direction: column;
	padding: 32px 30px;
	border-radius: 16px;
	background: linear-gradient(160deg, var(--bx-heading) 0%, var(--bx-accent) 100%);
	color: #fff;
}
/* Met achtergrondfoto: bordeaux overlay (gradient met transparantie) over de foto */
html body .bx-hd__promo.has-image {
	background:
		linear-gradient(160deg, var(--bx-promo-ov1) 0%, var(--bx-promo-ov2) 100%),
		var(--bx-promo-img) var(--bx-promo-pos) / cover no-repeat;
}
html body .bx-hd__promo-circle {
	position: absolute;
	border-radius: 50%;
	background: rgba(255, 255, 255, .08);
}
html body .bx-hd__promo-circle--1 { right: -40px; bottom: -60px; width: 180px; height: 180px; }
html body .bx-hd__promo-circle--2 { right: -20px; bottom: -20px; width: 90px; height: 90px; }
html body .bx-hd__promo-title {
	position: relative;
	font-size: 28px;
	font-weight: 600;
	line-height: 1.15;
}
html body .bx-hd-wrap .bx-hd__promo-text {
	position: relative;
	flex: 1;
	margin-top: 14px;
	font-size: 15px;
	line-height: 1.6;
	color: #F5DFE2;
}
html body .bx-hd-wrap .bx-hd__promo-btn {
	position: relative;
	display: flex;
	justify-content: space-between;
	align-items: center;
	gap: 8px;
	margin-top: 24px;
	padding: 14px 20px;
	border: 0;
	border-radius: 999px;
	background: #fff;
	color: var(--bx-heading);
	font-size: 14px;
	font-weight: 600;
	transition: background-color .15s ease;
}
html body .bx-hd-wrap .bx-hd__promo-btn:hover { background: #F5DFE2; color: var(--bx-heading); }

/* Zoekpaneel */
html body .bx-hd__backdrop {
	position: fixed;
	inset: 0;
	z-index: 40;
}
html body .bx-hd__panel {
	position: absolute;
	top: 100%;
	left: 0;
	right: 0;
	z-index: 50;
	background: #fff;
	border-bottom: 1px solid var(--bx-border);
	box-shadow: 0 24px 64px rgba(110, 26, 40, .18);
}
html body .bx-hd__panel-inner {
	max-width: var(--bx-maxw);
	margin: 0 auto;
	display: grid;
	grid-template-columns: 280px minmax(0, 1fr);
}
html body .bx-hd__panel-inner:not(:has(.bx-hd__filters)) { grid-template-columns: minmax(0, 1fr); }
html body .bx-hd__filters {
	display: flex;
	flex-direction: column;
	gap: 24px;
	padding: 28px 24px 28px var(--bx-px);
	background: var(--bx-surface);
	border-right: 1px solid var(--bx-border);
}
html body .bx-hd__eyebrow {
	margin-bottom: 10px;
	font-size: 11px;
	font-weight: 600;
	letter-spacing: .1em;
	text-transform: uppercase;
	color: var(--bx-muted);
}
html body .bx-hd__fterms--rows { display: flex; flex-direction: column; gap: 6px; }
html body .bx-hd__fterms--pills { display: flex; flex-wrap: wrap; gap: 6px; }
html body .bx-hd-wrap .bx-hd__fterms--rows .bx-hd__fterm {
	display: flex;
	align-items: center;
	gap: 8px;
	width: 100%;
	padding: 7px 10px;
	border: 0;
	border-radius: 8px;
	background: transparent;
	color: var(--bx-body);
	font-size: 12px;
	font-weight: 500;
	text-align: left;
	transition: background-color .15s ease, color .15s ease;
}
html body .bx-hd-wrap .bx-hd__fterms--rows .bx-hd__fterm[aria-pressed="true"] {
	background: #fff;
	color: var(--bx-accent);
	font-weight: 600;
	box-shadow: 0 2px 8px rgba(110, 26, 40, .08);
}
html body .bx-hd__fterms--rows .bx-hd__fterm-label { flex: 1; }
html body .bx-hd__fterms--rows .bx-hd__fterm-count { font-size: 11px; opacity: .7; }
html body .bx-hd-wrap .bx-hd__fterms--pills .bx-hd__fterm {
	padding: 6px 11px;
	border: 1px solid var(--bx-border);
	border-radius: 999px;
	background: #fff;
	color: var(--bx-body);
	font-size: 12px;
	font-weight: 500;
	transition: background-color .15s ease, color .15s ease, border-color .15s ease;
}
html body .bx-hd-wrap .bx-hd__fterms--pills .bx-hd__fterm[aria-pressed="true"] {
	border-color: var(--bx-accent);
	background: var(--bx-accent);
	color: #fff;
}
html body .bx-hd-wrap .bx-hd__freset {
	align-self: flex-start;
	padding: 0;
	border: 0;
	background: none;
	color: var(--bx-accent);
	font-size: 12px;
	font-weight: 500;
	text-decoration: underline;
}
html body .bx-hd__results {
	display: flex;
	flex-direction: column;
	gap: 16px;
	padding: 28px var(--bx-px) 28px 32px;
	max-height: 560px;
	overflow: auto;
}
html body .bx-hd__suggest-list { display: flex; flex-wrap: wrap; gap: 8px; }
html body .bx-hd-wrap .bx-hd__suggest-btn {
	padding: 8px 14px;
	border: 1px solid var(--bx-border);
	border-radius: 999px;
	background: #fff;
	color: var(--bx-heading);
	font-size: 12px;
	font-weight: 500;
	transition: border-color .15s ease, color .15s ease;
}
html body .bx-hd-wrap .bx-hd__suggest-btn:hover { border-color: var(--bx-accent); color: var(--bx-accent); }
html body .bx-hd__results-head {
	display: flex;
	justify-content: space-between;
	align-items: center;
	gap: 12px;
}
html body .bx-hd__results-head .bx-hd__eyebrow { margin-bottom: 0; }
html body .bx-hd__results-hint { font-size: 11px; color: var(--bx-muted); }
html body .bx-hd__empty {
	padding: 32px 0;
	text-align: center;
	font-size: 13px;
	color: var(--bx-muted);
}
html body .bx-hd__empty-title {
	margin-bottom: 6px;
	font-size: 16px;
	font-weight: 600;
	color: var(--bx-heading);
}
html body .bx-hd__grid {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 4px 24px;
}
html body .bx-hd-wrap .bx-hd__result {
	display: grid;
	grid-template-columns: 56px minmax(0, 1fr) auto;
	gap: 14px;
	align-items: center;
	padding: 10px 8px;
	border-radius: 12px;
	color: inherit;
	transition: background-color .15s ease;
}
html body .bx-hd-wrap .bx-hd__result:hover { background: var(--bx-surface); }
html body .bx-hd__thumb {
	width: 56px;
	height: 56px;
	overflow: hidden;
	border: 1px solid var(--bx-border);
	border-radius: 10px;
	background: var(--bx-surface);
	display: grid;
	place-items: center;
	color: var(--bx-accent);
	font-size: 10px;
	font-weight: 600;
}
html body .bx-hd-wrap .bx-hd__thumb img { display: block; width: 100%; height: 100%; max-width: 100%; object-fit: contain; }
html body .bx-hd__rbody { min-width: 0; }
html body .bx-hd__rcat { font-size: 11px; font-weight: 500; color: var(--bx-accent); }
html body .bx-hd__rname {
	font-size: 14px;
	font-weight: 600;
	line-height: 1.3;
	color: var(--bx-heading);
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}
html body .bx-hd__rmeta { margin-top: 2px; font-size: 11px; color: var(--bx-muted); }
html body .bx-hd__rprice { text-align: right; }
html body .bx-hd__rprice-now { font-size: 15px; font-weight: 700; color: var(--bx-heading); }
html body .bx-hd__rprice-was { font-size: 11px; color: var(--bx-muted); text-decoration: line-through; }
html body .bx-hd-wrap .bx-hd__all {
	display: block;
	padding: 12px;
	border-radius: 999px;
	background: var(--bx-accent);
	color: #fff;
	font-size: 13px;
	font-weight: 600;
	text-align: center;
	transition: background-color .15s ease;
}
html body .bx-hd-wrap .bx-hd__all:hover { background: var(--bx-heading); color: #fff; }

/* Mobiel menu */
html body .bx-hd__mobile {
	position: absolute;
	top: 100%;
	left: 0;
	right: 0;
	z-index: 45;
	max-height: calc(100vh - 120px);
	overflow: auto;
	padding: 8px var(--bx-px) 20px;
	background: #fff;
	border-bottom: 1px solid var(--bx-border);
	box-shadow: 0 24px 64px rgba(110, 26, 40, .14);
}
html body .bx-hd__mitem {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	border-bottom: 1px solid var(--bx-border);
}
html body .bx-hd-wrap .bx-hd__mlink {
	flex: 1;
	padding: 14px 0;
	font-size: 15px;
	font-weight: 500;
	color: var(--bx-body);
}
html body .bx-hd-wrap .bx-hd__mlink.is-active { color: var(--bx-accent); font-weight: 600; }
html body .bx-hd-wrap .bx-hd__mtoggle {
	width: 40px;
	height: 40px;
	padding: 0;
	border: 1px solid var(--bx-border);
	border-radius: 50%;
	background: #fff;
	color: var(--bx-heading);
	display: grid;
	place-items: center;
	transition: transform .2s ease;
}
html body .bx-hd-wrap .bx-hd__mtoggle[aria-expanded="true"] { transform: rotate(180deg); }
html body .bx-hd__msub {
	flex-basis: 100%;
	padding: 4px 0 12px 12px;
	border-left: 2px solid var(--bx-accent-soft);
	margin-bottom: 8px;
}
html body .bx-hd__msub .bx-hd__eyebrow { margin: 10px 0 4px; }
html body .bx-hd-wrap .bx-hd__msub-link {
	display: block;
	padding: 7px 0;
	font-size: 14px;
	color: var(--bx-body);
}
html body .bx-hd-wrap .bx-hd__mpromo {
	display: block;
	margin-top: 16px;
	padding: 14px 18px;
	border-radius: 999px;
	background: var(--bx-accent);
	color: #fff;
	font-size: 14px;
	font-weight: 600;
	text-align: center;
}

/* Responsive header */
@media (max-width: 1024px) {
	html body .bx-hd-wrap { --bx-px: 32px; }
	html body .bx-hd__inner { grid-template-columns: auto minmax(0, 1fr); column-gap: 16px; }
	html body .bx-hd__nav { display: none; }
	html body .bx-hd__mega { display: none !important; }
	html body .bx-hd-wrap .bx-hd__burger { display: flex; }
	html body .bx-hd__search-box, html body .bx-hd__search.is-open .bx-hd__search-box { width: 180px; }
	html body .bx-hd__panel-inner, html body .bx-hd__panel-inner:not(:has(.bx-hd__filters)) { grid-template-columns: minmax(0, 1fr); }
	html body .bx-hd__filters {
		flex-direction: row;
		flex-wrap: wrap;
		gap: 16px 28px;
		padding: 20px var(--bx-px);
		border-right: 0;
		border-bottom: 1px solid var(--bx-border);
	}
	html body .bx-hd__fterms--rows { flex-direction: row; flex-wrap: wrap; }
	html body .bx-hd-wrap .bx-hd__fterms--rows .bx-hd__fterm { width: auto; }
	html body .bx-hd__results { padding: 20px var(--bx-px); max-height: 70vh; }
	html body .bx-hd__grid { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 767px) {
	html body .bx-hd-wrap { --bx-px: 16px; --bx-hd-h: 64px; --bx-hd-logo-h: 36px; }
	html body .bx-hd__actions { gap: 8px; }
	html body .bx-hd__search-box { width: 44px; padding: 0 5px; }
	html body .bx-hd__search:not(.is-open) .bx-hd__search-input, html body .bx-hd__search:not(.is-open) .bx-hd__search-clear { display: none; }
	html body .bx-hd__search.is-open .bx-hd__search-box {
		position: absolute;
		top: 50%;
		left: var(--bx-px);
		right: var(--bx-px);
		z-index: 5;
		width: auto;
		padding: 0 6px 0 16px;
		transform: translateY(-50%);
		background: #fff;
		box-shadow: 0 6px 24px rgba(110, 26, 40, .12);
	}
	html body .bx-hd__search.is-open ~ .bx-hd__cart, html body .bx-hd__search.is-open ~ .bx-hd__burger { visibility: hidden; }
	html body .bx-hd__search.is-open { position: static; }
	html body .bx-hd-wrap .bx-hd__cart { padding: 0 12px; }
	html body .bx-hd__cart-total { display: none; }
	html body .bx-hd__filters { gap: 12px 20px; }
}

/* ==================================================================
   Sidecart (bx-sc) — ontwerp: Bioxcin Sidecart.html
   ================================================================== */
@keyframes bxScSlide { from { transform: translateX(100%); } to { transform: translateX(0); } }
@keyframes bxScFade { from { opacity: 0; } to { opacity: 1; } }

html body .bx-sc { position: fixed; inset: 0; z-index: 100000; }
html body .bx-sc[hidden] { display: none !important; }
html body .bx-sc *, html body .bx-sc *::before, html body .bx-sc *::after { box-sizing: border-box; }
html body .bx-sc p { margin: 0; }
html body .bx-sc button { font-family: inherit; cursor: pointer; -webkit-appearance: none; appearance: none; }
html body .bx-sc a { text-decoration: none; }

html body .bx-sc__overlay {
	position: absolute;
	inset: 0;
	background: rgba(43, 26, 30, .45);
	animation: bxScFade .2s ease;
}
html body .bx-sc__panel {
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	width: 460px;
	max-width: 100%;
	display: flex;
	flex-direction: column;
	background: #fff;
	box-shadow: -24px 0 64px rgba(110, 26, 40, .2);
	animation: bxScSlide .28s cubic-bezier(.2, .8, .2, 1);
	font-family: 'Outfit', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
	font-size: 14px;
	line-height: 1.5;
	color: var(--bx-body, #2B1A1E);
	-webkit-font-smoothing: antialiased;
}

html body .bx-sc__head {
	display: flex;
	justify-content: space-between;
	align-items: center;
	padding: 22px 28px;
	border-bottom: 1px solid var(--bx-border, #EAD9DC);
}
html body .bx-sc__title { font-size: 20px; font-weight: 700; color: var(--bx-heading, #6E1A28); }
html body .bx-sc__count { margin-top: 2px; font-size: 12px; color: var(--bx-muted, #8A6E73); }
html body .bx-sc .bx-sc__close {
	width: 40px;
	height: 40px;
	padding: 0;
	border: 1px solid var(--bx-border, #EAD9DC);
	border-radius: 50%;
	background: #fff;
	color: var(--bx-heading, #6E1A28);
	font-size: 16px;
	display: grid;
	place-items: center;
	transition: background-color .15s ease;
}
html body .bx-sc .bx-sc__close:hover { background: var(--bx-surface, #F8F3F3); }

/* Gratis verzending */
html body .bx-sc__ship { padding: 16px 28px 0; }
html body .bx-sc__ship-box {
	padding: 12px 14px;
	border-radius: 12px;
	background: var(--bx-surface, #F8F3F3);
}
html body .bx-sc__ship-row {
	display: flex;
	justify-content: space-between;
	font-size: 12px;
	font-weight: 600;
	color: var(--bx-body, #2B1A1E);
}
html body .bx-sc__ship-check { color: #4E9A51; }
html body .bx-sc__ship-check[hidden] { display: none; }
html body .bx-sc__bar {
	height: 6px;
	margin-top: 8px;
	border-radius: 999px;
	background: var(--bx-border, #EAD9DC);
	overflow: hidden;
}
html body .bx-sc__bar-fill {
	height: 100%;
	width: 0;
	border-radius: 999px;
	background: var(--bx-accent, #8B2332);
	transition: width .3s ease;
}
html body .bx-sc.is-free .bx-sc__bar-fill { background: #4E9A51; }

/* Regels */
html body .bx-sc__body { flex: 1; overflow: auto; padding: 8px 28px; }
html body .bx-sc__empty {
	padding: 64px 0;
	text-align: center;
	color: var(--bx-muted, #8A6E73);
}
html body .bx-sc__empty-title { font-size: 18px; font-weight: 600; color: var(--bx-heading, #6E1A28); }
html body .bx-sc__empty p { margin-top: 8px; font-size: 13px; }
html body .bx-sc .bx-sc__continue {
	margin-top: 18px;
	padding: 12px 22px;
	border: 0;
	border-radius: 999px;
	background: var(--bx-accent, #8B2332);
	color: #fff;
	font-size: 13px;
	font-weight: 600;
}
html body .bx-sc .bx-sc__continue:hover { background: var(--bx-heading, #6E1A28); }

html body .bx-sc__line {
	display: grid;
	grid-template-columns: 84px minmax(0, 1fr);
	gap: 16px;
	padding: 18px 0;
	border-bottom: 1px solid var(--bx-border, #EAD9DC);
}
html body .bx-sc__thumb {
	width: 84px;
	height: 84px;
	border-radius: 12px;
	background: var(--bx-surface, #F8F3F3);
	overflow: hidden;
	display: grid;
	place-items: center;
	color: var(--bx-accent, #8B2332);
	font-size: 11px;
	font-weight: 600;
}
html body .bx-sc__thumb img { display: block; width: 100%; height: 100%; max-width: 100%; object-fit: contain; }
html body .bx-sc__line-body { min-width: 0; display: flex; flex-direction: column; gap: 6px; }
html body .bx-sc__line-top { display: flex; justify-content: space-between; gap: 12px; align-items: flex-start; }
html body .bx-sc__line-cat { font-size: 11px; font-weight: 500; color: var(--bx-accent, #8B2332); }
html body .bx-sc__line-name { font-size: 14px; font-weight: 600; line-height: 1.3; color: var(--bx-heading, #6E1A28); }
html body .bx-sc__line-name a { color: inherit; }
html body .bx-sc .bx-sc__remove {
	flex: none;
	padding: 0;
	border: 0;
	background: none;
	color: var(--bx-muted, #8A6E73);
	font-size: 12px;
	text-decoration: underline;
}
html body .bx-sc .bx-sc__remove:hover { color: var(--bx-accent, #8B2332); }
html body .bx-sc__line-bottom { display: flex; justify-content: space-between; align-items: center; margin-top: auto; }
html body .bx-sc__qty {
	display: flex;
	align-items: center;
	height: 34px;
	border: 1px solid #D9BFC4;
	border-radius: 999px;
}
html body .bx-sc .bx-sc__qty-btn {
	width: 32px;
	height: 32px;
	padding: 0;
	border: 0;
	background: none;
	color: var(--bx-heading, #6E1A28);
	font-size: 15px;
	line-height: 1;
}
html body .bx-sc .bx-sc__qty-btn[disabled] { opacity: .35; cursor: default; }
html body .bx-sc__qty-val { width: 18px; text-align: center; font-size: 13px; font-weight: 600; }
html body .bx-sc__line-price { text-align: right; }
html body .bx-sc__line-total { font-size: 15px; font-weight: 700; color: var(--bx-heading, #6E1A28); }
html body .bx-sc__line-was { font-size: 11px; color: var(--bx-muted, #8A6E73); text-decoration: line-through; }
html body .bx-sc.is-busy .bx-sc__lines, html body .bx-sc.is-busy .bx-sc__foot { opacity: .6; pointer-events: none; }

/* Upsell */
html body .bx-sc__upsell { margin-top: 20px; }
html body .bx-sc__eyebrow {
	margin-bottom: 10px;
	font-size: 11px;
	font-weight: 600;
	letter-spacing: .1em;
	text-transform: uppercase;
	color: var(--bx-muted, #8A6E73);
}
html body .bx-sc__up {
	display: grid;
	grid-template-columns: 56px minmax(0, 1fr) auto;
	gap: 12px;
	align-items: center;
	padding: 10px;
	margin-bottom: 8px;
	border: 1px solid var(--bx-border, #EAD9DC);
	border-radius: 12px;
}
html body .bx-sc__up-thumb {
	width: 56px;
	height: 56px;
	border-radius: 10px;
	background: var(--bx-surface, #F8F3F3);
	overflow: hidden;
	display: grid;
	place-items: center;
	color: var(--bx-accent, #8B2332);
	font-size: 10px;
	font-weight: 600;
}
html body .bx-sc__up-thumb img { display: block; width: 100%; height: 100%; max-width: 100%; object-fit: contain; }
html body .bx-sc__up-name { font-size: 13px; font-weight: 600; line-height: 1.3; color: var(--bx-heading, #6E1A28); }
html body .bx-sc__up-price { margin-top: 2px; font-size: 12px; color: var(--bx-muted, #8A6E73); }
html body .bx-sc .bx-sc__up-btn {
	padding: 8px 14px;
	border: 1.5px solid var(--bx-accent, #8B2332);
	border-radius: 999px;
	background: #fff;
	color: var(--bx-accent, #8B2332);
	font-size: 12px;
	font-weight: 600;
	white-space: nowrap;
	transition: background-color .15s ease, color .15s ease;
}
html body .bx-sc .bx-sc__up-btn:hover { background: var(--bx-accent, #8B2332); color: #fff; }

/* Totalen */
html body .bx-sc__foot {
	display: flex;
	flex-direction: column;
	gap: 10px;
	padding: 18px 28px 24px;
	border-top: 1px solid var(--bx-border, #EAD9DC);
	background: #fff;
}
html body .bx-sc__row { display: flex; justify-content: space-between; font-size: 13px; color: #5A3F46; }
html body .bx-sc__row--discount { color: #4E9A51; }
html body .bx-sc__total-row {
	display: flex;
	justify-content: space-between;
	align-items: baseline;
	padding-top: 10px;
	border-top: 1px solid var(--bx-border, #EAD9DC);
}
html body .bx-sc__total-label { font-size: 15px; font-weight: 600; color: var(--bx-body, #2B1A1E); }
html body .bx-sc__vat { font-size: 11px; font-weight: 400; color: var(--bx-muted, #8A6E73); }
html body .bx-sc__total { font-size: 22px; font-weight: 700; color: var(--bx-heading, #6E1A28); }
html body .bx-sc .bx-sc__checkout {
	display: flex;
	align-items: center;
	justify-content: center;
	height: 52px;
	margin-top: 6px;
	border: 0;
	border-radius: 999px;
	background: var(--bx-accent, #8B2332);
	color: #fff !important;
	font-size: 14px;
	font-weight: 600;
	transition: background-color .15s ease;
}
html body .bx-sc .bx-sc__checkout:hover { background: var(--bx-heading, #6E1A28); color: #fff !important; }
html body .bx-sc__usps {
	display: flex;
	justify-content: center;
	flex-wrap: wrap;
	gap: 8px 22px;
	margin-top: 8px;
	font-size: 12px;
	color: #5A3F46;
}
html body .bx-sc__usps span { display: flex; align-items: center; gap: 6px; }
html body .bx-sc__usps svg { color: #4E9A51; flex: none; }

html body.bx-sc-open { overflow: hidden; }

@media (max-width: 520px) {
	html body .bx-sc__panel { width: 100%; }
	html body .bx-sc__head { padding: 18px 20px; }
	html body .bx-sc__ship { padding: 14px 20px 0; }
	html body .bx-sc__body { padding: 8px 20px; }
	html body .bx-sc__foot { padding: 16px 20px 20px; }
	html body .bx-sc__line { grid-template-columns: 72px minmax(0, 1fr); gap: 12px; }
	html body .bx-sc__thumb { width: 72px; height: 72px; }
}

/* ==================================================================
   Shop-pagina's: winkelwagen, checkout, bedankt (ontwerpen bioxcin-*.html)
   ================================================================== */
html body .bx-shop {
	--bx-brand: #6E1A28;
	--bx-brand-deep: #55131F;
	--bx-brand-ink: #3B0D16;
	--bx-mist: #F8F1F2;
	--bx-mist-2: #EFE0E3;
	--bx-page: #FAF5F6;
	--bx-line: #E6D5D9;
	--bx-ink: #2A1A1E;
	--bx-soft: #6B535A;
	--bx-mute: #9A8489;
	--bx-gold: #E2B33A;
	--bx-gold-tint: #FBF3DD;
	--bx-ok: #2E7D4F;
	--bx-ok-light: #E9F4EF;
	--bx-err: #B3372F;
	--bx-radius: 16px;
	--bx-shadow: 0 1px 2px rgba(59, 13, 22, .05), 0 8px 28px rgba(59, 13, 22, .07);

	max-width: 1180px;
	margin: 0 auto;
	padding: 0 24px 40px;
	font-family: 'Outfit', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
	font-size: 15px;
	line-height: 1.55;
	color: var(--bx-ink);
	-webkit-font-smoothing: antialiased;
}
html body .bx-shop *, html body .bx-shop *::before, html body .bx-shop *::after { box-sizing: border-box; }
html body .bx-shop h1, html body .bx-shop h2, html body .bx-shop h3, html body .bx-shop p, html body .bx-shop ul, html body .bx-shop ol { margin: 0; }
html body .bx-shop a { color: inherit; text-decoration: none; }
html body .bx-shop button, html body .bx-shop input, html body .bx-shop select, html body .bx-shop textarea { font-family: inherit; }
html body .bx-shop button { cursor: pointer; }
html body .bx-shop [hidden] { display: none !important; }
html body .bx-shop .bx-notice { margin: 16px 0; }

html body .bx-card {
	background: #fff;
	border: 1px solid var(--bx-line);
	border-radius: var(--bx-radius);
}
html body .bx-eyebrow {
	display: block;
	font-size: 11px;
	font-weight: 700;
	letter-spacing: .16em;
	text-transform: uppercase;
	color: var(--bx-brand);
}
html body .bx-shop .bx-btn2 {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 10px;
	height: 52px;
	padding: 0 26px;
	border: 1.5px solid var(--bx-brand);
	border-radius: 999px;
	background: transparent;
	color: var(--bx-brand) !important;
	font-size: 12px;
	font-weight: 700;
	letter-spacing: .08em;
	text-transform: uppercase;
	transition: background-color .15s ease, color .15s ease;
}
html body .bx-shop .bx-btn2:hover { background: var(--bx-brand); color: #fff !important; }
html body .bx-shop .bx-btn2--b { background: var(--bx-brand); color: #fff !important; }
html body .bx-shop .bx-btn2--b:hover { background: var(--bx-brand-deep); }
html body .bx-shop .bx-btn2 svg { width: 16px; height: 16px; }

/* Stappenbalk */
html body .bx-steps {
	display: flex;
	justify-content: center;
	flex-wrap: wrap;
	padding: 28px 0 8px;
	font-size: 11px;
	font-weight: 700;
	letter-spacing: .08em;
	text-transform: uppercase;
	color: var(--bx-mute);
}
html body .bx-steps span { display: flex; align-items: center; gap: 8px; }
html body .bx-steps span::after {
	content: "";
	width: 48px;
	height: 1.5px;
	margin: 0 14px;
	background: var(--bx-line);
}
html body .bx-steps span:last-child::after { display: none; }
html body .bx-steps i {
	width: 24px;
	height: 24px;
	border: 1.5px solid var(--bx-line);
	border-radius: 50%;
	display: grid;
	place-items: center;
	font-style: normal;
	font-size: 11px;
}
html body .bx-steps i svg { width: 12px; height: 12px; }
html body .bx-steps .is-on { color: var(--bx-brand); }
html body .bx-steps .is-on i { background: var(--bx-brand); border-color: var(--bx-brand); color: #fff; }
html body .bx-steps .is-done { color: var(--bx-ok); }
html body .bx-steps .is-done i { background: var(--bx-ok); border-color: var(--bx-ok); color: #fff; }

/* Regels in overzichten */
html body .bx-line {
	display: flex;
	justify-content: space-between;
	gap: 12px;
	padding: 6px 0;
	font-size: 14px;
}
html body .bx-line--ok, html body .bx-ok { color: var(--bx-ok); font-weight: 600; }
html body .bx-line--total {
	margin-top: 8px;
	padding-top: 14px;
	border-top: 1px solid var(--bx-line);
	font-size: 20px;
	font-weight: 800;
	color: var(--bx-brand-ink);
}
html body .bx-line--total small {
	display: block;
	font-size: 12px;
	font-weight: 400;
	color: var(--bx-mute);
}
html body .bx-trust {
	display: grid;
	gap: 10px;
	margin: 18px 0 0;
	padding: 18px 0 0;
	border-top: 1px solid var(--bx-line);
	list-style: none;
	font-size: 13px;
	color: var(--bx-soft);
}
html body .bx-trust li { display: flex; gap: 10px; align-items: flex-start; }
html body .bx-trust svg { width: 16px; height: 16px; flex: none; margin-top: 2px; color: var(--bx-ok); }

/* ---------- Winkelwagen ---------- */
html body .bx-cart__title {
	margin-top: 10px;
	font-size: 30px;
	font-weight: 700;
	line-height: 1.15;
	letter-spacing: -.01em;
	color: var(--bx-brand-ink);
}
html body .bx-cart__count { font-size: 16px; font-weight: 400; color: var(--bx-mute); }
html body .bx-cart__layout {
	display: grid;
	grid-template-columns: minmax(0, 1fr) 380px;
	gap: 32px;
	align-items: start;
	margin-top: 24px;
}
html body .bx-cart__empty { margin-top: 24px; }
html body .bx-cart__empty-card { padding: 56px 24px; text-align: center; color: var(--bx-soft); }
html body .bx-cart__empty-title { font-size: 20px; font-weight: 700; color: var(--bx-brand-ink); }
html body .bx-cart__empty-card p { margin: 8px 0 18px; font-size: 14px; }
html body .bx-cart__ship {
	padding: 18px 24px;
	border-bottom: 1px solid var(--bx-line);
	border-radius: var(--bx-radius) var(--bx-radius) 0 0;
	background: var(--bx-mist);
	font-size: 13px;
}
html body .bx-cart__bar {
	height: 8px;
	margin-top: 10px;
	border-radius: 4px;
	background: #fff;
	overflow: hidden;
}
html body .bx-cart__bar-fill {
	display: block;
	height: 100%;
	width: 0;
	background: linear-gradient(90deg, var(--bx-gold), #F6D778);
	transition: width .3s ease;
}
html body .bx-cart.is-free .bx-cart__bar-fill { background: linear-gradient(90deg, var(--bx-ok), #5FBF8A); }
html body .bx-cart__item {
	display: grid;
	grid-template-columns: 96px 1fr auto;
	gap: 20px;
	align-items: center;
	padding: 22px 24px;
	border-bottom: 1px solid var(--bx-line);
}
html body .bx-cart__item:last-child { border-bottom: 0; }
html body .bx-cart__pic {
	width: 96px;
	height: 96px;
	border-radius: 12px;
	background: var(--bx-mist);
	display: grid;
	place-items: center;
	overflow: hidden;
}
html body .bx-cart__pic img { width: 84%; height: 84%; max-width: 84%; object-fit: contain; mix-blend-mode: multiply; }
html body .bx-cart__item h3 { font-size: 15px; font-weight: 700; color: var(--bx-brand-ink); }
html body .bx-cart__item small { display: block; margin-top: 2px; font-size: 13px; color: var(--bx-soft); }
html body .bx-cart__meta { display: flex; align-items: center; flex-wrap: wrap; gap: 16px; margin-top: 12px; }
html body .bx-qty {
	display: inline-flex;
	align-items: center;
	border: 1.5px solid var(--bx-line);
	border-radius: 999px;
	background: #fff;
}
html body .bx-shop .bx-qty button {
	width: 34px;
	height: 36px;
	border: 0;
	background: none;
	font-size: 16px;
	color: var(--bx-brand-deep);
}
html body .bx-shop .bx-qty button[disabled] { opacity: .35; cursor: default; }
html body .bx-qty output { width: 22px; text-align: center; font-size: 13px; font-weight: 700; }
html body .bx-shop .bx-cart__rm {
	border: 0;
	background: none;
	padding: 0;
	font-size: 12px;
	color: var(--bx-mute);
	text-decoration: underline;
	text-underline-offset: 3px;
}
html body .bx-shop .bx-cart__rm:hover { color: var(--bx-brand); }
html body .bx-cart__pr { text-align: right; font-size: 16px; font-weight: 700; color: var(--bx-brand-ink); }
html body .bx-cart__pr s { display: block; font-size: 12px; font-weight: 500; color: var(--bx-mute); }
html body .bx-cart.is-busy .bx-cart__items, html body .bx-cart.is-busy .bx-cart__sum { opacity: .6; pointer-events: none; }

html body .bx-cart__upsell {
	display: grid;
	grid-template-columns: 80px 1fr auto;
	gap: 18px;
	align-items: center;
	margin-top: 24px;
	padding: 22px 24px;
	background: var(--bx-gold-tint);
	border-color: #F0DDA3;
}
html body .bx-cart__upsell-pic {
	width: 80px;
	height: 80px;
	border-radius: 12px;
	background: #fff;
	display: grid;
	place-items: center;
	overflow: hidden;
}
html body .bx-cart__upsell-pic img { width: 84%; height: 84%; max-width: 84%; object-fit: contain; }
html body .bx-cart__upsell h3 { font-size: 15px; font-weight: 700; color: var(--bx-brand-ink); }
html body .bx-cart__upsell p { margin-top: 4px; font-size: 13px; color: var(--bx-soft); }
html body .bx-cart__upsell-act { display: flex; align-items: center; gap: 12px; }
html body .bx-cart__upsell-price { font-size: 16px; font-weight: 700; color: var(--bx-brand-ink); }
html body .bx-shop .bx-cart__upsell .bx-btn2 { height: 44px; padding: 0 20px; }
html body .bx-cart__continue {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	margin-top: 18px;
	font-size: 13px;
	font-weight: 500;
	color: var(--bx-brand) !important;
}
html body .bx-cart__sum { position: sticky; top: 24px; padding: 24px; }
html body .bx-cart__sum h2 { margin-bottom: 14px; font-size: 18px; font-weight: 700; color: var(--bx-brand-ink); }
html body .bx-cart__code { display: flex; gap: 8px; margin: 14px 0; }
html body .bx-shop .bx-cart__code input {
	flex: 1;
	min-width: 0;
	height: 44px;
	padding: 0 16px;
	border: 1.5px solid var(--bx-line);
	border-radius: 999px;
	background: #fff;
	font-size: 14px;
	color: var(--bx-ink);
}
html body .bx-shop .bx-cart__code input:focus { outline: none; border-color: var(--bx-brand); }
html body .bx-shop .bx-cart__code button {
	height: 44px;
	padding: 0 18px;
	border: 1.5px solid var(--bx-brand);
	border-radius: 999px;
	background: #fff;
	color: var(--bx-brand);
	font-size: 11px;
	font-weight: 700;
	letter-spacing: .08em;
	text-transform: uppercase;
}
html body .bx-shop .bx-cart__code button:hover { background: var(--bx-brand); color: #fff; }
html body .bx-cart__code-msg { font-size: 12px; color: var(--bx-err); margin: -6px 0 8px; }
html body .bx-cart__code-msg.is-ok { color: var(--bx-ok); }
html body .bx-cart__coupon { display: flex; justify-content: space-between; gap: 12px; padding: 6px 0; font-size: 14px; color: var(--bx-ok); }
html body .bx-shop .bx-cart__coupon button { border: 0; background: none; padding: 0; font-size: 12px; color: var(--bx-mute); text-decoration: underline; }
html body .bx-shop .bx-cart__sum .bx-btn2 { width: 100%; margin-top: 16px; }
html body .bx-cart__express { margin-top: 12px; text-align: center; font-size: 12px; color: var(--bx-mute); }
html body .bx-cart__express b { color: var(--bx-ink); }

@media (max-width: 900px) {
	html body .bx-cart__layout { grid-template-columns: 1fr; }
	html body .bx-cart__sum { position: static; }
}
@media (max-width: 600px) {
	html body .bx-cart__item { grid-template-columns: 72px 1fr; padding: 18px; }
	html body .bx-cart__pic { width: 72px; height: 72px; }
	html body .bx-cart__pr { grid-column: 2; text-align: left; display: flex; gap: 8px; align-items: baseline; }
	html body .bx-cart__upsell { grid-template-columns: 1fr; }
	html body .bx-cart__upsell-pic { display: none; }
	html body .bx-steps span::after { width: 18px; margin: 0 8px; }
	html body .bx-steps { font-size: 9px; }
}

/* ---------- Checkout ---------- */
html body .bx-co__back {
	display: inline-flex;
	align-items: center;
	gap: 7px;
	margin: 14px 0 22px;
	font-size: 13.5px;
	color: var(--bx-soft) !important;
}
html body .bx-co__back:hover { color: var(--bx-brand) !important; }
html body .bx-co .woocommerce-notices-wrapper:empty { display: none; }
html body .bx-co .woocommerce-error, html body .bx-co .woocommerce-message, html body .bx-co .woocommerce-info {
	margin: 0 0 18px;
	padding: 14px 18px;
	border: 1px solid var(--bx-line);
	border-radius: 10px;
	background: #fff;
	font-size: 14px;
	list-style: none;
}
html body .bx-co .woocommerce-error { border-color: #EBC5C1; background: #FBF1F0; color: var(--bx-err); }
html body .bx-co form.checkout {
	display: grid;
	grid-template-columns: minmax(0, 1fr) 420px;
	gap: 0 44px;
	align-items: start;
}
html body .bx-co form.checkout > * { grid-column: 1; }
html body .bx-co form.checkout > #order_review_heading, html body .bx-co form.checkout > #order_review, html body .bx-co form.checkout > .bx-co__aside { grid-column: 2; }
html body .bx-co form.checkout > .bx-co__aside { grid-row: 1 / span 12; position: sticky; top: 24px; }
html body .bx-blok {
	margin-bottom: 22px;
	padding: 28px;
	background: #fff;
	border: 1px solid var(--bx-line);
	border-radius: 14px;
	box-shadow: var(--bx-shadow);
}
html body .bx-blok__kop { display: flex; align-items: baseline; gap: 14px; margin-bottom: 22px; }
html body .bx-blok__nr { font-size: 15px; font-weight: 500; color: #C9A15C; }
html body .bx-blok__kop h2 { font-size: 21px; font-weight: 600; color: var(--bx-ink); }
html body .bx-blok__rechts { display: inline-flex; align-items: center; gap: 6px; margin-left: auto; font-size: 12.5px; color: var(--bx-soft); }

/* Velden met zwevende labels */
html body .bx-co .woocommerce-billing-fields h3, html body .bx-co .woocommerce-shipping-fields h3, html body .bx-co .woocommerce-additional-fields h3 { font-size: 15px; font-weight: 600; margin: 0 0 14px; color: var(--bx-ink); }
html body .bx-co .woocommerce-billing-fields h3 { display: none; }
html body .bx-co .woocommerce-billing-fields__field-wrapper, html body .bx-co .woocommerce-shipping-fields__field-wrapper, html body .bx-co .woocommerce-additional-fields__field-wrapper { display: flex; flex-wrap: wrap; gap: 0 14px; }
html body .bx-co p.form-row {
	position: relative;
	width: 100%;
	margin: 0 0 14px;
	padding: 0;
}
html body .bx-co p.form-row-first, html body .bx-co p.form-row-last { width: calc(50% - 7px); }
html body .bx-co p.form-row label {
	position: absolute;
	left: 15px;
	top: 16px;
	z-index: 1;
	margin: 0;
	font-size: 14.5px;
	line-height: 1.2;
	color: var(--bx-soft);
	pointer-events: none;
	transition: all .14s ease;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	max-width: calc(100% - 30px);
}
html body .bx-co p.form-row label .required { color: inherit; text-decoration: none; }
html body .bx-co p.form-row label .optional { display: none; }
html body .bx-co p.form-row .woocommerce-input-wrapper { display: block; }
html body .bx-co p.form-row input.input-text, html body .bx-co p.form-row select, html body .bx-co p.form-row .select2-container .select2-selection--single {
	width: 100%;
	height: auto;
	min-height: 54px;
	margin: 0;
	padding: 24px 14px 8px;
	border: 1.5px solid var(--bx-line);
	border-radius: 10px;
	background: #fff;
	box-shadow: none;
	font-family: inherit;
	font-size: 15px;
	line-height: 1.3;
	color: var(--bx-ink);
	transition: border-color .15s ease, box-shadow .15s ease;
	-webkit-appearance: none;
	appearance: none;
}
html body .bx-co p.form-row .select2-container .select2-selection--single .select2-selection__rendered { padding: 0; line-height: 1.3; color: var(--bx-ink); }
html body .bx-co p.form-row .select2-container .select2-selection--single .select2-selection__arrow { top: 12px; right: 8px; }
html body .bx-co p.form-row input.input-text::placeholder { color: transparent; }
html body .bx-co p.form-row input.input-text:focus, html body .bx-co p.form-row select:focus, html body .bx-co p.form-row .select2-container--open .select2-selection--single { outline: none; border-color: var(--bx-brand); box-shadow: 0 0 0 3px rgba(110, 26, 40, .08); }
html body .bx-co p.form-row.is-filled label, html body .bx-co p.form-row:focus-within label, html body .bx-co p.form-row.woocommerce-validated label, html body .bx-co p.form-row.woocommerce-invalid label, html body .bx-co p.form-row:has(input:not(:placeholder-shown)) label, html body .bx-co p.form-row:has(select) label, html body .bx-co p.form-row:has(.select2) label { top: 8px; font-size: 11px; letter-spacing: .03em; color: var(--bx-brand); }
html body .bx-co p.form-row.woocommerce-validated input.input-text, html body .bx-co p.form-row.woocommerce-validated select { border-color: #CBE3D7; }
html body .bx-co p.form-row.woocommerce-invalid input.input-text, html body .bx-co p.form-row.woocommerce-invalid select { border-color: var(--bx-err); }
html body .bx-co p.form-row.woocommerce-validated::after {
	content: "";
	position: absolute;
	right: 13px;
	top: 21px;
	width: 12px;
	height: 12px;
	border-right: 2px solid var(--bx-ok);
	border-bottom: 2px solid var(--bx-ok);
	transform: rotate(45deg);
	pointer-events: none;
}
html body .bx-co p.form-row.woocommerce-validated.form-row select ~ * { display: none; }
html body .bx-co .woocommerce-invalid .checkout-inline-error-message, html body .bx-co .checkout-inline-error-message { margin: 5px 2px 0; font-size: 12px; color: var(--bx-err); }

/* Ander verzendadres */
html body .bx-co #ship-to-different-address {
	margin: 4px 0 14px;
	font-size: 14px;
	font-weight: 500;
	color: var(--bx-ink);
}
html body .bx-co #ship-to-different-address label { display: inline-flex; align-items: center; gap: 10px; cursor: pointer; }
html body .bx-co #ship-to-different-address input { width: 18px; height: 18px; accent-color: var(--bx-brand); }
html body .bx-co .col2-set { display: block; }
html body .bx-co .col2-set .col-1, html body .bx-co .col2-set .col-2 { width: 100%; float: none; }
html body .bx-co .col2-set .col-2 { margin-top: 8px; }

/* Opmerking */
html body .bx-co .bx-co__notes summary {
	display: inline-flex;
	align-items: center;
	gap: 7px;
	list-style: none;
	cursor: pointer;
	font-size: 13.5px;
	color: var(--bx-soft);
}
html body .bx-co .bx-co__notes summary::-webkit-details-marker { display: none; }
html body .bx-co .bx-co__notes summary:hover { color: var(--bx-brand); }
html body .bx-co .bx-co__notes summary svg { transition: transform .2s ease; }
html body .bx-co .bx-co__notes[open] summary svg { transform: rotate(45deg); }
html body .bx-co .bx-co__notes .woocommerce-additional-fields { margin-top: 12px; }
html body .bx-co .bx-co__notes h3 { display: none; }
html body .bx-co .bx-co__notes p.form-row label { display: none; }
html body .bx-co .bx-co__notes textarea {
	width: 100%;
	min-height: 84px;
	padding: 12px 14px;
	border: 1.5px solid var(--bx-line);
	border-radius: 10px;
	font-size: 14px;
	color: var(--bx-ink);
	resize: vertical;
}
html body .bx-co .bx-co__notes textarea:focus { outline: none; border-color: var(--bx-brand); }

/* Keuzekaarten (verzending + betaling) */
html body .bx-co .bx-keuze, html body .bx-co ul.wc_payment_methods li.wc_payment_method > label {
	position: relative;
	display: flex;
	gap: 14px;
	align-items: flex-start;
	margin: 0 0 10px;
	padding: 16px;
	border: 1.5px solid var(--bx-line);
	border-radius: 10px;
	background: #fff;
	cursor: pointer;
	transition: border-color .15s ease, background-color .15s ease;
}
html body .bx-co .bx-keuze input { position: absolute; opacity: 0; width: 0; height: 0; }
html body .bx-co .bx-keuze.is-on { border-color: var(--bx-brand); background: #F8F1F2; }
html body .bx-keuze__rondje {
	flex: none;
	position: relative;
	width: 19px;
	height: 19px;
	margin-top: 1px;
	border: 1.5px solid #C9A3AB;
	border-radius: 50%;
	transition: border-color .15s ease;
}
html body .bx-keuze__rondje::after {
	content: "";
	position: absolute;
	inset: 4px;
	border-radius: 50%;
	background: var(--bx-brand);
	transform: scale(0);
	transition: transform .16s cubic-bezier(.34, 1.56, .64, 1);
}
html body .bx-co .bx-keuze.is-on .bx-keuze__rondje { border-color: var(--bx-brand); }
html body .bx-co .bx-keuze.is-on .bx-keuze__rondje::after { transform: scale(1); }
html body .bx-keuze__inhoud { flex: 1; min-width: 0; }
html body .bx-keuze__titel { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; font-size: 14.5px; font-weight: 600; color: var(--bx-ink); }
html body .bx-keuze__omschrijving { display: block; margin-top: 3px; font-size: 13px; color: var(--bx-soft); }
html body .bx-keuze__prijs { font-size: 14.5px; font-weight: 600; white-space: nowrap; color: var(--bx-ink); }
html body .bx-keuze__prijs.is-gratis { color: var(--bx-ok); }
html body .bx-tag {
	padding: 3px 8px;
	border-radius: 99px;
	background: var(--bx-ok-light);
	color: var(--bx-ok);
	font-size: 10.5px;
	font-weight: 600;
	letter-spacing: .05em;
	text-transform: uppercase;
}
html body .bx-co__noship { font-size: 13.5px; color: var(--bx-soft); }

/* Betaalmethodes (WooCommerce-markup) */
html body .bx-co #payment { background: transparent; border-radius: 0; }
html body .bx-co ul.wc_payment_methods { list-style: none; margin: 0; padding: 0; border: 0; }
html body .bx-co ul.wc_payment_methods li.wc_payment_method { margin: 0; padding: 0; list-style: none; }
html body .bx-co ul.wc_payment_methods li.wc_payment_method > input[type="radio"] { position: absolute; opacity: 0; width: 0; height: 0; }
html body .bx-co ul.wc_payment_methods li.wc_payment_method > label {
	margin: 0 0 10px;
	font-size: 14.5px;
	font-weight: 600;
	line-height: 1.4;
	color: var(--bx-ink);
}
html body .bx-co ul.wc_payment_methods li.wc_payment_method > label::before {
	content: "";
	flex: none;
	width: 19px;
	height: 19px;
	margin-top: 1px;
	border: 1.5px solid #C9A3AB;
	border-radius: 50%;
	background: #fff;
	transition: border-color .15s ease, box-shadow .15s ease;
}
html body .bx-co ul.wc_payment_methods li.wc_payment_method > input:checked + label {
	border-color: var(--bx-brand);
	background: #F8F1F2;
}
html body .bx-co ul.wc_payment_methods li.wc_payment_method > input:checked + label::before {
	border-color: var(--bx-brand);
	box-shadow: inset 0 0 0 4px #fff, inset 0 0 0 10px var(--bx-brand);
}
html body .bx-co ul.wc_payment_methods li.wc_payment_method > label img {
	max-height: 30px;
	width: auto;
	margin: 0 0 0 auto;
	padding: 3px 6px;
	border: 1px solid var(--bx-line);
	border-radius: 6px;
	background: #fff;
	vertical-align: middle;
}
html body .bx-co ul.wc_payment_methods li.wc_payment_method > label a { font-size: 12px; color: var(--bx-soft); }
html body .bx-co .payment_box {
	margin: -2px 0 12px !important;
	padding: 16px !important;
	border: 1.5px solid var(--bx-line);
	border-radius: 10px;
	background: #F8F1F2 !important;
	font-size: 13px;
	color: var(--bx-soft);
}
html body .bx-co .payment_box::before { display: none !important; }
html body .bx-co .payment_box p:last-child { margin-bottom: 0; }
html body .bx-co .place-order { display: block; width: 100%; margin: 26px 0 0; padding: 0; float: none; }
html body .bx-co__trust { width: 100%; }
html body .bx-co .woocommerce-terms-and-conditions-wrapper { margin: 0; }
html body .bx-co .woocommerce-privacy-policy-text p, html body .bx-co .woocommerce-terms-and-conditions-checkbox-text {
	margin: 14px 0 0;
	font-size: 12px;
	line-height: 1.6;
	text-align: center;
	color: var(--bx-soft);
}
html body .bx-co .woocommerce-privacy-policy-text a, html body .bx-co .woocommerce-terms-and-conditions-wrapper a { color: var(--bx-brand); }
html body .bx-co .form-row.validate-required.woocommerce-invalid .woocommerce-terms-and-conditions-checkbox-text { color: var(--bx-err); }
html body .bx-co .place-order .form-row { margin: 0; }
html body .bx-co .place-order .form-row label { position: static; display: block; margin: 14px 0 0; pointer-events: auto; white-space: normal; max-width: none; }
html body .bx-co #place_order, html body .bx-co button.button.alt {
	width: 100%;
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 10px;
	margin: 0;
	padding: 18px;
	border: 0;
	border-radius: 12px;
	background: var(--bx-brand) !important;
	color: #fff !important;
	font-family: inherit;
	font-size: 16px;
	font-weight: 600;
	letter-spacing: .01em;
	text-transform: none;
	line-height: 1.2;
	cursor: pointer;
	transition: background-color .15s ease, transform .1s ease;
}
html body .bx-co #place_order:hover { background: var(--bx-brand-deep) !important; }
html body .bx-co #place_order:active { transform: scale(.99); }
html body .bx-co__trust {
	display: flex;
	justify-content: center;
	flex-wrap: wrap;
	gap: 8px 22px;
	margin-top: 18px;
	font-size: 12.5px;
	color: var(--bx-soft);
}
html body .bx-co__trust span { display: inline-flex; align-items: center; gap: 7px; }
html body .bx-co__trust svg { color: var(--bx-ok); }

/* Bestelling (aside) */
html body .bx-co__aantal { float: right; font-size: 13px; font-weight: 400; color: var(--bx-soft); margin-top: 6px; }
html body .bx-co #order_review_heading {
	margin: 0;
	padding: 30px 28px 0;
	border: 1px solid var(--bx-line);
	border-bottom: 0;
	border-radius: 18px 18px 0 0;
	background: #fff;
	font-size: 22px;
	font-weight: 500;
	color: var(--bx-ink);
}
html body .bx-co #order_review {
	padding: 0 28px 30px;
	border: 1px solid var(--bx-line);
	border-top: 0;
	border-radius: 0 0 18px 18px;
	background: #fff;
	box-shadow: var(--bx-shadow);
}
html body .bx-co .bx-co__aside { border-radius: 18px; }
html body .bx-co table.shop_table, html body .bx-co table.shop_table tbody, html body .bx-co table.shop_table thead, html body .bx-co table.shop_table tfoot, html body .bx-co table.shop_table tr, html body .bx-co table.shop_table th, html body .bx-co table.shop_table td { display: block; width: 100%; border: 0; padding: 0; margin: 0; background: transparent; text-align: left; }
html body .bx-co table.shop_table { margin: 22px 0 0; border-collapse: collapse; }
html body .bx-co table.shop_table thead { display: none; }
html body .bx-co table.shop_table tr.cart_item {
	display: flex;
	gap: 13px;
	align-items: center;
	margin-bottom: 16px;
}
html body .bx-co table.shop_table tr.cart_item td.product-name {
	display: flex;
	flex: 1;
	min-width: 0;
	align-items: center;
	gap: 13px;
	font-size: 13.5px;
	font-weight: 500;
	line-height: 1.35;
	color: var(--bx-ink);
}
html body .bx-co table.shop_table tr.cart_item td.product-name .product-quantity { display: none; }
html body .bx-co table.shop_table tr.cart_item td.product-name .variation { margin: 2px 0 0; font-size: 12px; color: var(--bx-soft); }
html body .bx-co table.shop_table tr.cart_item td.product-name .variation dt, html body .bx-co table.shop_table tr.cart_item td.product-name .variation dd { display: inline; margin: 0; font-weight: 400; }
html body .bx-co table.shop_table tr.cart_item td.product-total { width: auto; flex: none; text-align: right; font-size: 13.5px; font-weight: 600; white-space: nowrap; }
html body .bx-co__thumb {
	position: relative;
	flex: none;
	width: 52px;
	height: 52px;
	border: 1px solid var(--bx-line);
	border-radius: 10px;
	background: var(--bx-page);
	display: grid;
	place-items: center;
	overflow: visible;
}
html body .bx-co__thumb img { width: 84%; height: 84%; max-width: 84%; object-fit: contain; mix-blend-mode: multiply; border-radius: 8px; }
html body .bx-co__qty {
	position: absolute;
	top: -6px;
	right: -6px;
	min-width: 19px;
	height: 19px;
	padding: 0 5px;
	border-radius: 99px;
	background: var(--bx-brand);
	color: #fff;
	font-size: 10.5px;
	font-weight: 700;
	display: grid;
	place-items: center;
}
html body .bx-co__name { min-width: 0; }
html body .bx-co table.shop_table tr.bx-co__extra td, html body .bx-co table.shop_table tr.bx-co__after td { display: block; }
html body .bx-co__bundle {
	display: flex;
	align-items: center;
	justify-content: space-between;
	margin: 6px 0 4px;
	padding: 10px 14px;
	border: 1px solid #CBE3D7;
	border-radius: 10px;
	background: var(--bx-ok-light);
	font-size: 13px;
	color: var(--bx-ok);
}
html body .bx-co__bundle b { display: inline-flex; align-items: center; gap: 7px; font-weight: 600; }
html body .bx-co__code { display: flex; gap: 8px; margin: 14px 0 4px; }
html body .bx-co .bx-co__code input {
	flex: 1;
	min-width: 0;
	padding: 12px 14px;
	border: 1.5px solid var(--bx-line);
	border-radius: 10px;
	background: #fff;
	font-size: 14px;
	color: var(--bx-ink);
}
html body .bx-co .bx-co__code input:focus { outline: none; border-color: var(--bx-brand); }
html body .bx-co .bx-co__code button {
	padding: 12px 18px;
	border: 0;
	border-radius: 10px;
	background: var(--bx-brand);
	color: #fff;
	font-size: 13.5px;
	font-weight: 600;
	transition: background-color .15s ease;
}
html body .bx-co .bx-co__code button:hover { background: var(--bx-brand-deep); }
html body .bx-co__code-msg { margin: 6px 2px 0; font-size: 12px; color: var(--bx-err); }
html body .bx-co__code-msg.is-ok { color: var(--bx-ok); }
html body .bx-co table.shop_table tfoot { margin-top: 20px; padding-top: 20px; border-top: 1px solid var(--bx-line); }
html body .bx-co table.shop_table tfoot tr {
	display: flex;
	justify-content: space-between;
	gap: 12px;
	margin-bottom: 10px;
	font-size: 14px;
	color: var(--bx-soft);
}
html body .bx-co table.shop_table tfoot tr th { width: auto; font-weight: 400; }
html body .bx-co table.shop_table tfoot tr td { width: auto; text-align: right; color: var(--bx-ink); }
html body .bx-co table.shop_table tfoot tr.fee td, html body .bx-co table.shop_table tfoot tr.cart-discount td { color: var(--bx-ok); font-weight: 600; }
html body .bx-co table.shop_table tfoot tr.cart-discount .woocommerce-remove-coupon { margin-left: 6px; font-size: 12px; font-weight: 400; color: var(--bx-mute); }
html body .bx-co table.shop_table tfoot tr.woocommerce-shipping-totals { display: none; }
html body .bx-co table.shop_table tfoot tr.order-total {
	margin: 0;
	padding-top: 20px;
	border-top: 1px solid var(--bx-line);
	align-items: baseline;
	font-size: 16px;
}
html body .bx-co table.shop_table tfoot tr.order-total th { font-weight: 600; color: var(--bx-ink); }
html body .bx-co table.shop_table tfoot tr.order-total td { font-size: 24px; font-weight: 700; color: var(--bx-brand); }
html body .bx-co table.shop_table tfoot tr.order-total td .includes_tax, html body .bx-co table.shop_table tfoot tr.order-total td .tax_label { display: block; font-size: 11.5px; font-weight: 400; color: var(--bx-soft); }
html body .bx-co table.shop_table tfoot tr.bx-co__after { display: block; margin: 0; }
html body .bx-co__bespaard {
	margin-top: 18px;
	padding: 12px 16px;
	border: 1px solid var(--bx-line);
	border-radius: 10px;
	background: var(--bx-page);
	text-align: center;
	font-size: 13.5px;
	color: var(--bx-brand-deep);
}
html body .bx-co__bespaard b { color: var(--bx-brand); }
html body .bx-co__levering {
	display: flex;
	gap: 10px;
	align-items: flex-start;
	margin-top: 18px;
	font-size: 13px;
	line-height: 1.5;
	color: var(--bx-soft);
}
html body .bx-co__levering svg { flex: none; margin-top: 2px; color: var(--bx-ok); }
html body .bx-co__levering b { color: var(--bx-ink); }
html body .bx-co__rating {
	display: flex;
	align-items: center;
	gap: 12px;
	margin-top: 22px;
	padding-top: 20px;
	border-top: 1px solid var(--bx-line);
	font-size: 12.5px;
	color: var(--bx-soft);
}
html body .bx-co__stars { display: flex; gap: 2px; color: #C9A15C; }
html body .bx-co .blockUI.blockOverlay { border-radius: 18px; }

@media (max-width: 980px) {
	html body .bx-co form.checkout { grid-template-columns: 1fr; }
	html body .bx-co form.checkout > #order_review_heading, html body .bx-co form.checkout > #order_review, html body .bx-co form.checkout > .bx-co__aside { grid-column: 1; }
	html body .bx-co form.checkout > .bx-co__aside { grid-row: 1; position: static; margin-bottom: 24px; }
	html body .bx-co #order_review_heading { padding: 24px 22px 0; }
	html body .bx-co #order_review { padding: 0 22px 24px; }
}
@media (max-width: 560px) {
	html body .bx-shop { padding: 0 18px 32px; }
	html body .bx-blok { padding: 22px 18px; }
	html body .bx-co p.form-row-first, html body .bx-co p.form-row-last { width: 100%; }
}

/* ---------- Bedanktpagina ---------- */
html body .bx-ty__hero { text-align: center; padding: 40px 0 10px; }
html body .bx-ty__big {
	width: 88px;
	height: 88px;
	margin: 0 auto 22px;
	border-radius: 50%;
	background: var(--bx-ok);
	color: #fff;
	display: grid;
	place-items: center;
	box-shadow: 0 0 0 12px rgba(46, 125, 79, .12);
	animation: bxTyPop .5s cubic-bezier(.2, 1.4, .4, 1);
}
html body .bx-ty__big.is-failed { background: var(--bx-err); box-shadow: 0 0 0 12px rgba(179, 55, 47, .12); }
html body .bx-ty__big svg { width: 40px; height: 40px; }
@keyframes bxTyPop { from { transform: scale(.4); opacity: 0; } to { transform: scale(1); opacity: 1; } }
html body .bx-ty__hero h1 { font-size: clamp(28px, 3.4vw, 42px); font-weight: 700; line-height: 1.15; letter-spacing: -.01em; color: var(--bx-brand-ink); }
html body .bx-ty__hero > p { max-width: 560px; margin: 12px auto 0; font-size: 16px; color: var(--bx-soft); }
html body .bx-ty__hero > p b { color: var(--bx-ink); }
html body .bx-ty__ord {
	display: inline-flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 24px;
	margin-top: 22px;
	padding: 14px 26px;
	border: 1px solid var(--bx-line);
	border-radius: 999px;
	background: #fff;
	font-size: 13px;
	color: var(--bx-soft);
}
html body .bx-ty__ord b { color: var(--bx-brand-ink); }
html body .bx-ty__layout {
	display: grid;
	grid-template-columns: minmax(0, 1fr) 380px;
	gap: 28px;
	align-items: start;
	margin-top: 36px;
}
html body .bx-ty__card { padding: 26px 28px; }
html body .bx-ty__card + .bx-ty__card { margin-top: 18px; }
html body .bx-ty__card h2 { margin-bottom: 18px; font-size: 17px; font-weight: 700; color: var(--bx-brand-ink); }
html body .bx-ty__timeline {
	list-style: none;
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	position: relative;
}
html body .bx-ty__timeline li { position: relative; padding-right: 12px; font-size: 13px; color: var(--bx-soft); }
html body .bx-ty__timeline li::before {
	content: "";
	position: absolute;
	top: 15px;
	left: 32px;
	right: 0;
	height: 2px;
	background: var(--bx-line);
}
html body .bx-ty__timeline li:last-child::before { display: none; }
html body .bx-ty__timeline li.is-done::before { background: var(--bx-ok); }
html body .bx-ty__timeline i {
	position: relative;
	z-index: 1;
	width: 32px;
	height: 32px;
	margin-bottom: 12px;
	border: 2px solid var(--bx-line);
	border-radius: 50%;
	background: #fff;
	display: grid;
	place-items: center;
	color: var(--bx-mute);
}
html body .bx-ty__timeline i svg { width: 15px; height: 15px; }
html body .bx-ty__timeline li.is-done i { background: var(--bx-ok); border-color: var(--bx-ok); color: #fff; }
html body .bx-ty__timeline li.is-now i { border-color: var(--bx-brand); color: var(--bx-brand); }
html body .bx-ty__timeline b { display: block; font-size: 13px; font-weight: 600; color: var(--bx-brand-ink); }
html body .bx-ty__two { display: grid; grid-template-columns: 1fr 1fr; gap: 28px; font-size: 14px; }
html body .bx-ty__two h3 { margin-bottom: 8px; font-size: 12px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: var(--bx-mute); }
html body .bx-ty__two p { color: var(--bx-soft); }
html body .bx-ty__two p b { font-weight: 500; color: var(--bx-ink); }
html body .bx-ty__tip {
	border: 0;
	background: linear-gradient(160deg, var(--bx-brand-ink), var(--bx-brand-deep));
	color: #fff;
}
html body .bx-ty__tip .bx-eyebrow { color: #F1D27A; }
html body .bx-ty__tip h2 { margin: 8px 0 12px; color: #fff; }
html body .bx-ty__tip p { font-size: 14px; line-height: 1.6; color: #F0DEE2; }
html body .bx-ty__tip ol { display: grid; gap: 8px; margin: 16px 0 0 18px; font-size: 14px; color: #F0DEE2; }
html body .bx-ty__tip ol b { color: #fff; }
html body .bx-shop .bx-ty__tip-btn { margin-top: 20px; border-color: #fff; background: #fff; color: var(--bx-brand-deep); }
html body .bx-shop .bx-ty__tip-btn:hover { background: #F5DFE2; color: var(--bx-brand-deep); }
html body .bx-ty__oi {
	display: grid;
	grid-template-columns: 56px 1fr auto;
	gap: 12px;
	align-items: center;
	padding: 10px 0;
	border-bottom: 1px solid var(--bx-line);
	font-size: 13px;
}
html body .bx-ty__pic {
	width: 56px;
	height: 56px;
	border-radius: 10px;
	background: var(--bx-mist);
	display: grid;
	place-items: center;
	overflow: hidden;
}
html body .bx-ty__pic img { width: 84%; height: 84%; max-width: 84%; object-fit: contain; mix-blend-mode: multiply; }
html body .bx-ty__oi b { display: block; font-weight: 600; color: var(--bx-brand-ink); }
html body .bx-ty__oi small { color: var(--bx-soft); }
html body .bx-ty__line-first { margin-top: 8px; }
html body .bx-ty__help { margin-top: 18px; padding: 18px 20px; }
html body .bx-ty__help h2 { margin-bottom: 8px; font-size: 15px; font-weight: 700; color: var(--bx-brand-ink); }
html body .bx-ty__help p { font-size: 13px; color: var(--bx-soft); }
html body .bx-shop .bx-ty__help a {
	display: flex;
	align-items: center;
	gap: 10px;
	margin-top: 12px;
	font-size: 13px;
	font-weight: 600;
	color: var(--bx-brand);
}
html body .bx-ty__acts { display: flex; justify-content: center; flex-wrap: wrap; gap: 12px; margin-top: 36px; }
html body .bx-ty__acts--top { margin-top: 22px; }
@media (max-width: 900px) { html body .bx-ty__layout { grid-template-columns: 1fr; } }
@media (max-width: 600px) {
	html body .bx-ty__timeline { grid-template-columns: 1fr 1fr; gap: 18px; }
	html body .bx-ty__timeline li::before { display: none; }
	html body .bx-ty__two { grid-template-columns: 1fr; }
	html body .bx-ty__card { padding: 20px; }
}

/* ==================================================================
   Mijn account (bx-acc) — ontwerp: bioxcin-dashboard.html
   ================================================================== */
html body .bx-acc { max-width: 1280px; }
html body .bx-acc .woocommerce { display: grid; grid-template-columns: 250px minmax(0, 1fr); gap: 28px; align-items: start; padding: 32px 0 72px; }
html body .bx-acc .woocommerce-notices-wrapper { grid-column: 1 / -1; }
html body .bx-acc .woocommerce-notices-wrapper:empty { display: none; }
html body .bx-acc .woocommerce::before, html body .bx-acc .woocommerce::after { content: none; display: none; }
html body .bx-acc .woocommerce .woocommerce-MyAccount-content { min-width: 0; width: auto; float: none; }
html body .bx-acc .woocommerce .bx-acc__side, html body .bx-acc .bx-acc__side .woocommerce-MyAccount-navigation { width: auto; float: none; }
html body .bx-acc__side { position: sticky; top: 24px; }
html body .bx-acc__who { display: flex; gap: 14px; align-items: center; padding: 22px; border-bottom: 1px solid var(--bx-line); }
html body .bx-acc__av {
	flex: none;
	width: 48px;
	height: 48px;
	border-radius: 50%;
	background: var(--bx-brand);
	color: #fff;
	display: grid;
	place-items: center;
	font-size: 17px;
	font-weight: 700;
}
html body .bx-acc__who b { display: block; font-weight: 700; color: var(--bx-brand-ink); }
html body .bx-acc__who small { font-size: 12px; color: var(--bx-soft); }
html body .bx-acc__nav { display: grid; gap: 2px; padding: 10px; }
html body .bx-acc__nav ul { display: none; }
html body .bx-acc .bx-acc__nav a {
	display: flex;
	align-items: center;
	gap: 12px;
	padding: 11px 14px;
	border-radius: 10px;
	font-size: 14px;
	font-weight: 500;
	color: var(--bx-soft);
	transition: background-color .15s ease, color .15s ease;
}
html body .bx-acc .bx-acc__nav a svg { flex: none; }
html body .bx-acc .bx-acc__nav a:hover { background: var(--bx-mist); color: var(--bx-brand); }
html body .bx-acc .bx-acc__nav a.is-on { background: var(--bx-brand); color: #fff; }
html body .bx-acc__out { margin: 6px 10px 10px; padding-top: 8px; border-top: 1px solid var(--bx-line); }
html body .bx-acc .bx-acc__out a { display: flex; align-items: center; gap: 12px; padding: 11px 14px; font-size: 14px; color: var(--bx-mute); }
html body .bx-acc .bx-acc__out a:hover { color: var(--bx-brand); }
html body .bx-acc__help {
	margin-top: 16px;
	padding: 18px 20px;
	border: 0;
	background: linear-gradient(160deg, var(--bx-brand-ink), var(--bx-brand-deep));
	color: #fff;
}
html body .bx-acc__help b { display: block; font-size: 14px; font-weight: 700; }
html body .bx-acc__help p { margin: 4px 0 12px; font-size: 12.5px; color: #F0DEE2; }
html body .bx-shop .bx-acc__help .bx-btn2 { height: 38px; padding: 0 14px; border-color: #fff; background: #fff; color: var(--bx-brand-deep) !important; font-size: 11px; }
html body .bx-acc__hi {
	display: flex;
	justify-content: space-between;
	align-items: flex-end;
	flex-wrap: wrap;
	gap: 20px;
	margin-bottom: 22px;
}
html body .bx-acc__hi h1 { margin-top: 6px; font-size: 30px; font-weight: 700; line-height: 1.15; letter-spacing: -.01em; color: var(--bx-brand-ink); }
html body .bx-acc__hi p { margin-top: 4px; color: var(--bx-soft); }
html body .bx-acc__grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 18px; }
html body .bx-acc__kpi { padding: 20px 22px; }
html body .bx-acc__kpi small { display: block; font-size: 12px; color: var(--bx-soft); }
html body .bx-acc__kpi b { display: block; margin-top: 6px; font-size: 28px; font-weight: 800; line-height: 1; color: var(--bx-brand); }
html body .bx-acc__kpi b .amount { font-size: inherit; color: inherit; }
html body .bx-acc__note { display: block; margin-top: 8px; font-size: 12px; color: var(--bx-soft); }
html body .bx-acc__two { display: grid; grid-template-columns: 1.25fr .75fr; gap: 18px; margin-top: 18px; }
html body .bx-acc__sec { padding: 24px; }
html body .bx-acc__sec--mt { margin-top: 18px; }
html body .bx-acc__two > div > .bx-acc__sec + .bx-acc__sec { margin-top: 18px; }
html body .bx-acc__sec h2 { display: flex; justify-content: space-between; align-items: center; gap: 12px; font-size: 17px; font-weight: 700; color: var(--bx-brand-ink); }
html body .bx-acc .bx-acc__sec h2 a { font-size: 13px; font-weight: 500; color: var(--bx-brand); text-decoration: underline; text-underline-offset: 3px; }
html body .bx-acc__sec--dark { border: 0; background: linear-gradient(160deg, var(--bx-brand-ink), var(--bx-brand-deep)); color: #fff; }
html body .bx-acc__sec--dark h2 { color: #fff; }
html body .bx-acc__sec--dark p { margin-top: 10px; font-size: 13.5px; line-height: 1.6; color: #F0DEE2; }
html body .bx-acc__sec--dark .bx-acc__by { margin-top: 12px; font-size: 12px; color: #D9BEC4; }
html body .bx-acc__muted { margin-top: 6px; font-size: 13.5px; color: var(--bx-soft); }
html body .bx-acc__subbox { display: grid; grid-template-columns: 96px 1fr; gap: 18px; align-items: center; margin-top: 16px; }
html body .bx-acc__pic { width: 96px; height: 96px; border-radius: 12px; background: var(--bx-mist); display: grid; place-items: center; overflow: hidden; }
html body .bx-acc__pic img { width: 84%; height: 84%; max-width: 84%; object-fit: contain; mix-blend-mode: multiply; }
html body .bx-acc__subbox b { display: block; font-size: 15px; font-weight: 700; color: var(--bx-brand-ink); }
html body .bx-acc__subbox small { display: block; margin-top: 2px; font-size: 13px; color: var(--bx-soft); }
html body .bx-pill { display: inline-flex; align-items: center; gap: 6px; margin-top: 8px; padding: 5px 10px; border-radius: 999px; font-size: 11px; font-weight: 700; }
html body .bx-pill--ok { background: var(--bx-ok-light); color: var(--bx-ok); }
html body .bx-pill--gold { background: var(--bx-gold-tint); color: #B98A18; }
html body .bx-acc__actions { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 16px; }
html body .bx-shop .bx-acc__actions .bx-btn2 { height: 40px; padding: 0 14px; font-size: 11px; gap: 8px; }
html body .bx-shop .bx-btn2--g { border-color: var(--bx-line); background: #fff; color: var(--bx-ink) !important; }
html body .bx-shop .bx-btn2--g:hover { border-color: var(--bx-brand); background: #fff; color: var(--bx-brand) !important; }
html body .bx-acc__next {
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
	gap: 12px;
	margin-top: 16px;
	padding: 14px 16px;
	border-radius: 12px;
	background: var(--bx-mist);
	font-size: 13px;
}
html body .bx-acc__next--block { display: block; }
html body .bx-acc__next b { color: var(--bx-brand-ink); }
html body .bx-acc__track { display: grid; grid-template-columns: repeat(4, 1fr); gap: 6px; margin-top: 14px; }
html body .bx-acc__track div { padding-top: 10px; border-top: 3px solid var(--bx-line); font-size: 11px; color: var(--bx-mute); }
html body .bx-acc__track div.is-done { border-color: var(--bx-ok); color: var(--bx-ok); }
html body .bx-acc__track div.is-now { border-color: var(--bx-brand); color: var(--bx-brand); font-weight: 600; }
html body .bx-acc__track b { display: block; font-size: 12px; font-weight: 700; color: inherit; }
html body .bx-acc__lst { margin-top: 14px; font-size: 13.5px; }
html body .bx-acc__r { display: flex; justify-content: space-between; gap: 12px; padding: 10px 0; border-bottom: 1px solid var(--bx-line); }
html body .bx-acc__r:last-child { border-bottom: 0; }
html body .bx-acc__r > span:last-child { font-weight: 600; color: var(--bx-brand-ink); text-align: right; }
html body .bx-acc__r--product { align-items: center; }
html body .bx-acc__prod { display: flex; gap: 12px; align-items: center; min-width: 0; }
html body .bx-acc__prod b { display: block; font-weight: 700; color: var(--bx-brand-ink); }
html body .bx-acc__prod b a { color: inherit; }
html body .bx-acc__prod small { color: var(--bx-soft); }
html body .bx-acc__thumb { flex: none; width: 52px; height: 52px; border-radius: 10px; background: var(--bx-mist); display: grid; place-items: center; overflow: hidden; }
html body .bx-acc__thumb img { width: 84%; height: 84%; max-width: 84%; object-fit: contain; mix-blend-mode: multiply; }
html body .bx-acc__price { display: flex; flex-direction: column; align-items: flex-end; gap: 8px; white-space: nowrap; }
html body .bx-acc__price s { margin-right: 6px; font-size: 12px; font-weight: 400; color: var(--bx-mute); }
html body .bx-acc__price .amount { color: inherit; }
html body .bx-shop .bx-acc__price .bx-btn2 { height: 34px; padding: 0 12px; font-size: 10px; }
html body .bx-acc__tags { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 12px; }
html body .bx-acc__tags span, html body .bx-acc .bx-acc__tags a { padding: 5px 11px; border: 1px solid var(--bx-line); border-radius: 999px; background: #fff; font-size: 12px; color: var(--bx-ink); }
html body .bx-acc .bx-acc__tags a:hover { border-color: var(--bx-brand); color: var(--bx-brand); }
html body .bx-acc__filters { margin-top: 0; }
html body .bx-acc .bx-acc__filters button { padding: 5px 11px; border: 1px solid var(--bx-line); border-radius: 999px; background: #fff; font-size: 12px; color: var(--bx-ink); }
html body .bx-acc .bx-acc__filters button.is-on { background: var(--bx-brand); border-color: var(--bx-brand); color: #fff; }
html body .bx-acc__table { width: 100%; border-collapse: collapse; margin-top: 12px; font-size: 13.5px; }
html body .bx-acc__table th { padding: 10px 0; border-bottom: 1px solid var(--bx-line); text-align: left; font-size: 11px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--bx-mute); }
html body .bx-acc__table td { padding: 14px 10px 14px 0; border-bottom: 1px solid var(--bx-line); vertical-align: middle; }
html body .bx-acc__table tr:last-child td { border-bottom: 0; }
html body .bx-acc__table td b { display: block; font-weight: 700; color: var(--bx-brand-ink); }
html body .bx-acc__table td small { font-size: 12px; color: var(--bx-mute); }
html body .bx-acc .bx-acc__table td a { font-weight: 500; color: var(--bx-brand); white-space: nowrap; }
html body .bx-st { padding: 5px 10px; border-radius: 999px; font-size: 11px; font-weight: 700; white-space: nowrap; }
html body .bx-st--ok { background: var(--bx-ok-light); color: var(--bx-ok); }
html body .bx-st--ship { background: var(--bx-gold-tint); color: #B98A18; }
html body .bx-st--muted { background: var(--bx-mist); color: var(--bx-mute); }
html body .bx-acc__det td { padding-top: 0; }
html body .bx-acc__detbox { display: grid; gap: 8px; padding: 16px 18px; border-radius: 12px; background: var(--bx-mist); font-size: 13px; color: var(--bx-soft); }
html body .bx-acc__detbox b { display: block; font-size: 11px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--bx-brand); }
html body .bx-acc__detbox .bx-acc__actions { margin-top: 4px; }
html body .bx-acc__pagination { display: flex; gap: 8px; margin-top: 16px; }
html body .bx-acc__addr { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin-top: 14px; font-size: 13.5px; }
html body .bx-acc__addr--stack { grid-template-columns: 1fr; }
html body .bx-acc__addr div { position: relative; padding: 14px 16px; border: 1px solid var(--bx-line); border-radius: 12px; line-height: 1.5; }
html body .bx-acc__addr b { display: block; margin-bottom: 6px; font-size: 12px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--bx-brand) !important; }
html body .bx-acc .bx-acc__addr a { position: absolute; top: 12px; right: 12px; font-size: 12px; color: var(--bx-mute) !important; text-decoration: underline; text-underline-offset: 3px; }
html body .bx-acc .bx-acc__addr a:hover { color: var(--bx-brand) !important; }

/* WooCommerce-onderdelen binnen het account (formulieren, bestelling bekijken) */
html body .bx-acc .woocommerce-MyAccount-content > form, html body .bx-acc .woocommerce-MyAccount-content > .woocommerce-order-details, html body .bx-acc .woocommerce-MyAccount-content > .woocommerce-customer-details, html body .bx-acc .woocommerce-MyAccount-content > .woocommerce-Addresses, html body .bx-acc .woocommerce-MyAccount-content > .woocommerce-address-fields, html body .bx-acc .woocommerce-MyAccount-content > .woocommerce-EditAccountForm, html body .bx-acc .woocommerce-MyAccount-content > .woocommerce-table--order-details, html body .bx-acc .woocommerce-MyAccount-content > p.order-info { padding: 24px; margin-bottom: 18px; background: #fff; border: 1px solid var(--bx-line); border-radius: var(--bx-radius); }
html body .bx-acc .woocommerce-MyAccount-content > form.edit-account fieldset, html body .bx-acc .woocommerce-MyAccount-content fieldset { margin: 24px 0 0; padding: 0; border: 0; }
html body .bx-acc .woocommerce-MyAccount-content legend { margin-bottom: 14px; font-size: 17px; font-weight: 700; color: var(--bx-brand-ink); }
html body .bx-acc .woocommerce-MyAccount-content h2, html body .bx-acc .woocommerce-MyAccount-content h3 { margin: 0 0 14px; font-size: 17px; font-weight: 700; color: var(--bx-brand-ink); }
html body .bx-acc .woocommerce-MyAccount-content .form-row { position: relative; }
html body .bx-acc .woocommerce-MyAccount-content form.edit-account,
html body .bx-acc .woocommerce-MyAccount-content .woocommerce-address-fields__field-wrapper { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 14px; }
html body .bx-acc .woocommerce-MyAccount-content form.edit-account > :not(.form-row-first):not(.form-row-last),
html body .bx-acc .woocommerce-MyAccount-content .woocommerce-address-fields__field-wrapper > :not(.form-row-first):not(.form-row-last) { grid-column: 1 / -1; }
html body .bx-acc .woocommerce-MyAccount-content .form-row { margin-bottom: 14px; }
html body .bx-acc .woocommerce-MyAccount-content .clear { display: none; }
html body .bx-acc .woocommerce-MyAccount-content button.button, html body .bx-acc .woocommerce-MyAccount-content .woocommerce-Button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	height: 50px;
	padding: 0 24px;
	border: 0;
	border-radius: 999px;
	background: var(--bx-brand);
	color: #fff;
	font-family: inherit;
	font-size: 12px;
	font-weight: 700;
	letter-spacing: .08em;
	text-transform: uppercase;
	cursor: pointer;
}
html body .bx-acc .woocommerce-MyAccount-content button.button:hover { background: var(--bx-brand-deep); }
html body .bx-acc .woocommerce-MyAccount-content p.form-row.woocommerce-form-row--wide label, html body .bx-acc .woocommerce-MyAccount-content p.form-row-wide label { max-width: calc(100% - 30px); }
html body .bx-acc .woocommerce-MyAccount-content .woocommerce-form-row span em, html body .bx-acc .woocommerce-MyAccount-content .form-row span em { display: block; margin-top: 6px; font-size: 12px; color: var(--bx-mute); }
html body .bx-acc .woocommerce-MyAccount-content table.shop_table { width: 100%; border-collapse: collapse; font-size: 13.5px; }
html body .bx-acc .woocommerce-MyAccount-content table.shop_table th, html body .bx-acc .woocommerce-MyAccount-content table.shop_table td { padding: 12px 10px 12px 0; border: 0; border-bottom: 1px solid var(--bx-line); text-align: left; vertical-align: middle; }
html body .bx-acc .woocommerce-MyAccount-content table.shop_table th { font-size: 11px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--bx-mute); }
html body .bx-acc .woocommerce-MyAccount-content table.shop_table tfoot th { font-size: 13.5px; text-transform: none; letter-spacing: 0; color: var(--bx-soft); font-weight: 500; }
html body .bx-acc .woocommerce-MyAccount-content table.shop_table tfoot tr:last-child th, html body .bx-acc .woocommerce-MyAccount-content table.shop_table tfoot tr:last-child td { border-bottom: 0; font-weight: 700; color: var(--bx-brand-ink); }
html body .bx-acc .woocommerce-MyAccount-content .woocommerce-column__title { font-size: 12px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--bx-brand); }
html body .bx-acc .woocommerce-MyAccount-content address { font-style: normal; font-size: 13.5px; line-height: 1.6; color: var(--bx-soft); }
html body .bx-acc .woocommerce-MyAccount-content .woocommerce-columns--addresses { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; }
html body .bx-acc .woocommerce-MyAccount-content .woocommerce-column { width: auto; float: none; }
html body .bx-acc .woocommerce-MyAccount-content .woocommerce-Addresses .woocommerce-Address a.edit { font-size: 12px; color: var(--bx-brand); text-decoration: underline; }
html body .bx-acc .woocommerce-MyAccount-content mark { background: var(--bx-gold-tint); padding: 0 4px; border-radius: 4px; }
html body .bx-acc .woocommerce-message, html body .bx-acc .woocommerce-info { margin: 0 0 18px; padding: 14px 18px; border: 1px solid #CBE3D7; border-radius: 10px; background: var(--bx-ok-light); font-size: 14px; color: var(--bx-ok); list-style: none; }
html body .bx-acc .woocommerce-message a, html body .bx-acc .woocommerce-info a { color: var(--bx-brand); text-decoration: underline; }
html body .bx-acc .wc-block-components-notice-banner { margin: 0 0 18px; border-color: var(--bx-line); border-radius: 10px; background: var(--bx-mist); color: var(--bx-ink); font-size: 14px; }
html body .bx-acc .wc-block-components-notice-banner > svg { background-color: var(--bx-brand); }
html body .bx-acc .wc-block-components-notice-banner a { color: var(--bx-brand); }
html body .bx-acc .woocommerce-error { margin: 0 0 18px; padding: 14px 18px; border: 1px solid #EBC5C1; border-radius: 10px; background: #FBF1F0; font-size: 14px; color: var(--bx-err); list-style: none; }

@media (max-width: 1024px) {
	html body .bx-acc .woocommerce { grid-template-columns: 1fr; padding-top: 20px; }
	html body .bx-acc__side { position: static; }
	html body .bx-acc__who { display: none; }
	html body .bx-acc__nav { display: flex; gap: 6px; overflow-x: auto; scrollbar-width: none; }
	html body .bx-acc .bx-acc__nav a { white-space: nowrap; }
	html body .bx-acc__out, html body .bx-acc__help { display: none; }
	html body .bx-acc__grid { grid-template-columns: 1fr 1fr; }
	html body .bx-acc__two { grid-template-columns: 1fr; }
}
@media (max-width: 640px) {
	html body .bx-acc__grid { grid-template-columns: 1fr; }
	html body .bx-acc__subbox { grid-template-columns: 72px 1fr; }
	html body .bx-acc__pic { width: 72px; height: 72px; }
	html body .bx-acc__track { grid-template-columns: 1fr 1fr; }
	html body .bx-acc__addr { grid-template-columns: 1fr; }
	html body .bx-acc__table thead { display: none; }
	html body .bx-acc__table td:nth-child(2), html body .bx-acc__table td:nth-child(3) { display: none; }
	html body .bx-acc__hi h1 { font-size: 24px; }
	html body .bx-acc .woocommerce-MyAccount-content .woocommerce-columns--addresses { grid-template-columns: 1fr; }
	html body .bx-acc .woocommerce-MyAccount-content form.edit-account,
	html body .bx-acc .woocommerce-MyAccount-content .woocommerce-address-fields__field-wrapper { grid-template-columns: minmax(0, 1fr); }
}

/* ---------- Inloggen / registreren (bx-login) — ontwerp: bioxcin-login.html body ---------- */
html body .bx-acc--login .woocommerce { display: block; padding: 0 0 40px; }
html body .bx-login {
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
	margin-top: 24px;
	border-radius: 22px;
	overflow: hidden;
	border: 1px solid var(--bx-line);
	background: #fff;
}
html body .bx-login__brand {
	position: relative;
	overflow: hidden;
	display: flex;
	flex-direction: column;
	justify-content: flex-end;
	min-height: 640px;
	padding: 56px;
	color: #fff;
	background-color: var(--bx-brand-deep);
	background-image: linear-gradient(180deg, rgba(59, 13, 22, .15) 0%, rgba(59, 13, 22, .55) 55%, rgba(59, 13, 22, .92) 100%), var(--bx-login-img, none);
	background-size: cover;
	background-position: center;
}
html body .bx-login__brand::before { content: ""; position: absolute; inset: 0; background: repeating-linear-gradient(135deg, rgba(255, 255, 255, .04) 0 14px, rgba(255, 255, 255, 0) 14px 28px); pointer-events: none; }
html body .bx-login__txt { position: relative; max-width: 480px; }
html body .bx-login__txt h2 { font-size: clamp(26px, 2.6vw, 36px); font-weight: 700; line-height: 1.15; color: #fff; text-shadow: 0 2px 20px rgba(0, 0, 0, .25); }
html body .bx-login__txt > p { margin-top: 12px; font-size: 15px; color: #F0DEE2; }
html body .bx-login__q { display: flex; gap: 14px; align-items: flex-start; margin-top: 28px; padding-top: 22px; border-top: 1px solid rgba(255, 255, 255, .22); font-size: 14px; color: #F0DEE2; }
html body .bx-login__av { flex: none; width: 40px; height: 40px; border-radius: 50%; background: #fff; color: var(--bx-brand); display: grid; place-items: center; font-weight: 700; }
html body .bx-login__q em { display: block; margin-top: 4px; font-style: normal; font-size: 12px; color: #D9BEC4; }
html body .bx-login__stars { display: inline-flex; gap: 2px; color: var(--bx-gold); }
html body .bx-login__panel { display: grid; place-items: center; padding: 40px 24px; }
html body .bx-login__box { width: 100%; max-width: 440px; }
html body .bx-login__tabs { display: flex; padding: 4px; margin-bottom: 28px; border-radius: 999px; background: var(--bx-mist); }
html body .bx-acc .bx-login__tabs button { flex: 1; height: 42px; border: 0; border-radius: 999px; background: transparent; font-size: 12px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--bx-soft); }
html body .bx-acc .bx-login__tabs button[aria-selected="true"] { background: #fff; color: var(--bx-brand); box-shadow: 0 2px 10px rgba(110, 26, 40, .1); }
html body .bx-login__box h1 { font-size: 28px; font-weight: 700; line-height: 1.15; color: var(--bx-brand-ink); }
html body .bx-login__sub { margin-top: 6px; font-size: 14px; color: var(--bx-soft); }
html body .bx-login__form { display: grid; gap: 16px; margin-top: 26px; }
html body .bx-login__two { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
html body .bx-f { display: flex; flex-direction: column; gap: 6px; }
html body .bx-f label { font-size: 12px; font-weight: 600; color: var(--bx-soft); }
html body .bx-f__in { position: relative; }
html body .bx-f__in > svg { position: absolute; left: 14px; top: 50%; transform: translateY(-50%); width: 17px; height: 17px; color: var(--bx-mute); pointer-events: none; }
html body .bx-acc .bx-f__in input {
	width: 100%;
	height: 50px;
	padding: 0 14px 0 42px;
	border: 1.5px solid var(--bx-line);
	border-radius: 12px;
	background: #fff;
	box-shadow: none;
	font-family: inherit;
	font-size: 15px;
	color: var(--bx-ink);
	transition: border-color .15s ease;
}
html body .bx-acc .bx-f__in input:focus { outline: 0; border-color: var(--bx-brand); box-shadow: 0 0 0 3px rgba(110, 26, 40, .1); }
html body .bx-acc .bx-f__tog { position: absolute; right: 6px; top: 50%; transform: translateY(-50%); width: 38px; height: 38px; border: 0; border-radius: 10px; background: none; display: grid; place-items: center; color: var(--bx-mute); }
html body .bx-acc .bx-f__tog svg { width: 18px; height: 18px; }
html body .bx-acc .bx-f__tog:hover { background: var(--bx-mist); color: var(--bx-brand); }
html body .bx-login__row { display: flex; justify-content: space-between; align-items: center; gap: 12px; font-size: 13px; color: var(--bx-soft); }
html body .bx-login__row label { display: flex; gap: 8px; align-items: center; cursor: pointer; }
html body .bx-acc .bx-login__row input { width: 16px; height: 16px; accent-color: var(--bx-brand); }
html body .bx-acc .bx-login__row a { color: var(--bx-brand); font-weight: 500; text-decoration: underline; text-underline-offset: 3px; }
html body .bx-shop .bx-btn2--full { width: 100%; height: 54px; }
html body .bx-login__or { display: flex; align-items: center; gap: 14px; margin-top: 16px; font-size: 12px; letter-spacing: .06em; text-transform: uppercase; color: var(--bx-mute); }
html body .bx-login__or::before, html body .bx-login__or::after { content: ""; flex: 1; height: 1px; background: var(--bx-line); }
html body .bx-login__alt { display: grid; gap: 10px; margin-top: 16px; }
html body .bx-login__guest { display: flex; gap: 10px; align-items: center; margin-top: 22px; padding: 16px 18px; border: 1px solid #F0DDA3; border-radius: 12px; background: var(--bx-gold-tint); font-size: 13px; color: #B98A18; }
html body .bx-login__guest svg { flex: none; }
html body .bx-acc .bx-login__guest a { margin-left: auto; white-space: nowrap; font-weight: 700; color: #B98A18; text-decoration: underline; text-underline-offset: 3px; }
html body .bx-login__perks { display: grid; gap: 8px; margin: 4px 0 0; padding: 0; list-style: none; font-size: 13px; color: var(--bx-soft); }
html body .bx-login__perks li { display: flex; gap: 10px; align-items: center; }
html body .bx-login__perks svg { width: 15px; height: 15px; color: var(--bx-ok); flex: none; }
html body .bx-login__strength { display: flex; gap: 4px; margin-top: 6px; }
html body .bx-login__strength i { flex: 1; height: 4px; border-radius: 2px; background: var(--bx-mist-2); }
html body .bx-login__strength i.is-on { background: var(--bx-ok); }
html body .bx-login__legal { font-size: 12px; text-align: center; color: var(--bx-mute); }
html body .bx-acc .bx-login__legal a { color: var(--bx-brand); text-decoration: underline; }
html body .bx-login__foot { margin-top: 28px; font-size: 12px; text-align: center; color: var(--bx-mute); }
html body .bx-login .woocommerce-error, html body .bx-login .woocommerce-message, html body .bx-login .woocommerce-info { margin-bottom: 18px; }
@media (max-width: 960px) {
	html body .bx-login { grid-template-columns: 1fr; }
	html body .bx-login__brand { min-height: 0; padding: 110px 24px 28px; }
	html body .bx-login__txt h2 { font-size: 22px; }
	html body .bx-login__q, html body .bx-login__txt > p { display: none; }
}
@media (max-width: 520px) { html body .bx-login__two { grid-template-columns: 1fr; } }

/* ==================================================================
   Footer (.bx-ft) — ontwerp "Bioxcin Footer.dc.html"
   ================================================================== */
html body .bx-ft-wrap {
	--bx-heading: #6E1A28;
	--bx-accent: #8B2332;
	--bx-accent-soft: #F7E9EB;
	--bx-body: #2B1A1E;
	--bx-text: #5A3F46;
	--bx-muted: #8A6E73;
	--bx-border: #EAD9DC;
	--bx-surface: #F8F3F3;
	--bx-white: #FFFFFF;
	--bx-ok: #3F8443;
	--bx-ok-soft: #EAF4EA;
	--bx-wa: #4E9A51;
	--bx-ft-bottom-bg: #55131F;
	--bx-ft-bottom-text: #F5DFE2;
	--bx-ft-main-bg: #6E1A28;
	--bx-ft-dark-text: #F5DFE2;
	--bx-ft-dark-title: #F1C9CF;
	--bx-ft-dark-muted: #E8B4BE;
	--bx-maxw: 1440px;
	--bx-px: 56px;
	--bx-ft-pt: 56px;
	--bx-ft-logo-h: 46px;
	--bx-ft-radius: 16px;

	font-family: 'Outfit', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
	font-size: 14px;
	line-height: 1.5;
	color: var(--bx-body);
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}
html body .bx-ft-wrap *, html body .bx-ft-wrap *::before, html body .bx-ft-wrap *::after { box-sizing: border-box; }
html body .bx-ft-wrap p, html body .bx-ft-wrap h4 { margin: 0; padding: 0; }
html body .bx-ft-wrap [hidden] { display: none !important; }
html body .bx-ft-wrap a { color: inherit; text-decoration: none; transition: color .15s ease, background-color .15s ease, border-color .15s ease; }
html body .bx-ft-wrap a:hover { text-decoration: none; }
html body .bx-ft-wrap button, html body .bx-ft-wrap input { font-family: inherit; }

html body .bx-ft { background: var(--bx-white); border-top: 1px solid var(--bx-border); }
html body .bx-ft__in { max-width: var(--bx-maxw); margin: 0 auto; padding-left: var(--bx-px); padding-right: var(--bx-px); }

/* USP-strook */
html body .bx-ft__usps { border-bottom: 1px solid var(--bx-border); }
html body .bx-ft__usps-in { display: grid; grid-template-columns: repeat(var(--bx-ft-usp-n, 4), minmax(0, 1fr)); }
html body .bx-ft__usp { display: flex; align-items: center; gap: 14px; min-width: 0; padding: 22px 20px; border-right: 1px solid var(--bx-border); }
html body .bx-ft__usp:first-child { padding-left: 0; }
html body .bx-ft__usp:last-child { padding-right: 0; border-right: 0; }
html body .bx-ft__usp-ic { flex: none; width: 42px; height: 42px; border-radius: 12px; background: var(--bx-accent-soft); color: var(--bx-accent); display: grid; place-items: center; }
html body .bx-ft__usp-ic svg { width: 20px; height: 20px; }
html body .bx-ft__usp-ic i { font-size: 20px; line-height: 1; }
html body .bx-ft__usp b { display: block; font-size: 14px; font-weight: 600; color: var(--bx-body); }
html body .bx-ft__usp small { display: block; margin-top: 2px; font-size: 12px; color: var(--bx-muted); }

/* Hoofd */
html body .bx-ft__main { display: grid; grid-template-columns: var(--bx-ft-cols, 1.5fr 1fr 1fr 1fr 1.4fr); gap: 40px; padding-top: var(--bx-ft-pt); padding-bottom: 40px; }
html body .bx-ft__brand, html body .bx-ft__col, html body .bx-ft__aside { min-width: 0; }
html body .bx-ft__logo { display: block; width: fit-content; line-height: 0; }
html body .bx-ft-wrap .bx-ft__logo img { display: block; height: var(--bx-ft-logo-h) !important; width: auto !important; max-width: 100%; }
html body .bx-ft__about { max-width: 340px; margin-top: 18px; font-size: 14px; line-height: 1.7; color: var(--bx-text); }
html body .bx-ft__rating { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; margin-top: 18px; font-size: 13px; color: var(--bx-text); }
html body .bx-ft__rating .bx-stars { color: var(--bx-accent); letter-spacing: 2px; }
html body .bx-ft__rating .bx-stars__empty { color: #E4CDD1; }
html body .bx-ft__rating b { color: var(--bx-body); }
html body .bx-ft__rating > span:last-child:not(.bx-stars) { color: var(--bx-muted); }
html body a.bx-ft__rating:hover b { color: var(--bx-accent); }
html body .bx-ft__social { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 22px; }
html body .bx-ft__social a { width: 40px; height: 40px; border-radius: 50%; border: 1px solid var(--bx-border); display: grid; place-items: center; color: var(--bx-heading); }
html body .bx-ft__social a:hover { background: var(--bx-accent); border-color: var(--bx-accent); color: #fff; }
html body .bx-ft__social svg { width: 18px; height: 18px; }

html body .bx-ft__col h4 { margin: 0 0 16px; font-size: 13px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: var(--bx-heading); }
html body .bx-ft__links { display: flex; flex-direction: column; gap: 10px; font-size: 14px; }
html body .bx-ft-wrap .bx-ft__links a { color: var(--bx-text); }
html body .bx-ft-wrap .bx-ft__links a:hover { color: var(--bx-accent); }

/* Nieuwsbrief + contact */
html body .bx-ft__aside { display: flex; flex-direction: column; gap: 20px; }
html body .bx-ft__nl { position: relative; container-type: inline-size; width: 100%; min-width: 0; padding: 22px; background: var(--bx-surface); border: 1px solid var(--bx-border); border-radius: var(--bx-ft-radius); }
html body .bx-ft__nl h4 { font-size: 17px; font-weight: 700; color: var(--bx-heading); }
html body .bx-ft__nl p { margin-top: 6px; font-size: 13px; line-height: 1.6; color: var(--bx-text); }
html body .bx-ft__nl-form { display: flex; gap: 8px; margin: 14px 0 0; }
html body .bx-ft-wrap .bx-ft__nl-form input[type="email"] { flex: 1 1 0; min-width: 0; height: 46px; min-height: 46px; margin: 0; padding: 0 14px; border: 1px solid #D9BFC4; border-radius: 10px; background: #fff; font-size: 13px; line-height: 1; color: var(--bx-body); outline: none; box-shadow: none; }
html body .bx-ft-wrap .bx-ft__nl-form input[type="email"]:focus { border-color: var(--bx-accent); box-shadow: 0 0 0 3px rgba(139, 35, 50, .12); }
html body .bx-ft-wrap .bx-ft__nl-form input::placeholder { color: var(--bx-muted); opacity: 1; }
html body .bx-ft-wrap .bx-ft__nl-form button { height: 46px; padding: 0 18px; border: 0; border-radius: 10px; background: var(--bx-accent); color: #fff !important; font-size: 13px; font-weight: 600; white-space: nowrap; cursor: pointer; transition: background-color .15s ease; }
html body .bx-ft-wrap .bx-ft__nl-form button:hover { background: var(--bx-heading); }
html body .bx-ft-wrap .bx-ft__nl-form button[disabled] { opacity: .6; cursor: default; }
html body .bx-ft__nl-legal { margin-top: 8px !important; font-size: 11px !important; line-height: 1.5 !important; color: var(--bx-muted) !important; }
html body .bx-ft-wrap .bx-ft__nl-legal a { color: var(--bx-accent); text-decoration: underline; text-underline-offset: 2px; }
html body .bx-ft__nl-ok { display: flex; align-items: center; gap: 8px; margin-top: 14px; padding: 12px 14px; border-radius: 10px; background: var(--bx-ok-soft); color: var(--bx-ok); font-size: 13px; font-weight: 600; }
html body .bx-ft__nl-err { margin-top: 8px; font-size: 12px; color: #B42318; }
html body .bx-ft__hp { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; opacity: 0; }
html body .bx-ft__contact { display: flex; flex-direction: column; gap: 8px; font-size: 13px; color: var(--bx-text); }
html body .bx-ft__contact > a, html body .bx-ft__contact > div { display: flex; align-items: center; gap: 10px; color: var(--bx-text); }
html body .bx-ft-wrap .bx-ft__contact > a:hover { color: var(--bx-accent); }
html body .bx-ft__contact b { color: var(--bx-body); }
html body .bx-ft__ic { flex: none; width: 30px; height: 30px; border-radius: 8px; display: grid; place-items: center; }
html body .bx-ft__ic svg { width: 15px; height: 15px; }
html body .bx-ft__ic--wa { background: var(--bx-ok-soft); color: var(--bx-wa); }
html body .bx-ft__ic--mail { background: var(--bx-accent-soft); color: var(--bx-accent); }
html body .bx-ft__ic--time { background: var(--bx-surface); color: var(--bx-muted); }

/* Onderbalk */
html body .bx-ft__bottom { background: var(--bx-ft-bottom-bg); color: var(--bx-ft-bottom-text); font-size: 12px; }
html body .bx-ft__bottom-in { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 14px 24px; padding-top: 18px; padding-bottom: 18px; }
html body .bx-ft__pay { display: flex; flex-wrap: wrap; gap: 6px; }
html body .bx-ft__pay span { display: inline-flex; align-items: center; padding: 4px 9px; border-radius: 4px; background: #fff; color: var(--bx-ft-bottom-bg) !important; font-size: 10px; font-weight: 700; line-height: 1.3; }
html body .bx-ft__pay span.bx-ft__pay-img { padding: 3px 7px; }
html body .bx-ft__pay img { display: block; height: 14px; width: auto; }
html body .bx-ft__legal { display: flex; flex-wrap: wrap; gap: 18px; }
html body .bx-ft-wrap .bx-ft__legal a { color: var(--bx-ft-bottom-text); }
html body .bx-ft-wrap .bx-ft__legal a:hover { color: #fff; }

/* Donkere hoofdsectie (bordeaux) */
html body .bx-ft--dark .bx-ft__mainwrap { background: var(--bx-ft-main-bg); }
html body .bx-ft--invert .bx-ft__logo img { filter: brightness(0) invert(1); }
html body .bx-ft--dark .bx-ft__about, html body .bx-ft--dark .bx-ft__rating, html body .bx-ft--dark .bx-ft__contact, html body .bx-ft--dark .bx-ft__contact > a, html body .bx-ft--dark .bx-ft__contact > div, html body .bx-ft--dark .bx-ft__nl p { color: var(--bx-ft-dark-text); }
html body .bx-ft--dark .bx-ft__rating .bx-stars { color: var(--bx-ft-dark-title); }
html body .bx-ft--dark .bx-ft__rating b { color: #fff; }
html body .bx-ft--dark .bx-ft__rating > span:last-child:not(.bx-stars) { color: var(--bx-ft-dark-muted); }
html body .bx-ft--dark a.bx-ft__rating:hover b { color: #fff; }
html body .bx-ft--dark .bx-ft__social a { border-color: rgba(255, 255, 255, .3); color: #fff; }
html body .bx-ft--dark .bx-ft__social a:hover { background: #fff; border-color: #fff; color: var(--bx-ft-main-bg); }
html body .bx-ft--dark .bx-ft__col h4 { color: var(--bx-ft-dark-title); }
html body .bx-ft--dark .bx-ft__links a { color: var(--bx-ft-dark-text); }
html body .bx-ft--dark .bx-ft__links a:hover { color: #fff; }
html body .bx-ft--dark .bx-ft__nl { background: rgba(255, 255, 255, .08); border-color: rgba(255, 255, 255, .16); }
html body .bx-ft--dark .bx-ft__nl h4 { color: #fff; }
html body .bx-ft--dark .bx-ft__nl-form input[type="email"] { border-color: transparent; }
html body .bx-ft--dark .bx-ft__nl-form input[type="email"]:focus { border-color: #fff; box-shadow: 0 0 0 3px rgba(255, 255, 255, .25); }
html body .bx-ft--dark .bx-ft__nl-form button { background: #fff; color: var(--bx-ft-main-bg) !important; }
html body .bx-ft--dark .bx-ft__nl-form button:hover { background: var(--bx-ft-dark-text); }
html body .bx-ft--dark .bx-ft__nl-legal { color: var(--bx-ft-dark-muted) !important; }
html body .bx-ft--dark .bx-ft__nl-legal a { color: #fff; }
html body .bx-ft--dark .bx-ft__nl-ok { background: rgba(255, 255, 255, .14); color: #fff; }
html body .bx-ft--dark .bx-ft__nl-err { color: #FFD3D3; }
html body .bx-ft--dark .bx-ft__contact b { color: #fff; }
html body .bx-ft--dark .bx-ft__contact > a:hover { color: #fff; }
html body .bx-ft--dark .bx-ft__ic--mail, html body .bx-ft--dark .bx-ft__ic--time { background: rgba(255, 255, 255, .12); color: #fff; }
html body .bx-ft--dark .bx-ft__bottom { border-top: 1px solid rgba(255, 255, 255, .1); }

@container (max-width: 300px) {
	html body .bx-ft__nl-form { flex-direction: column; }
	html body .bx-ft-wrap .bx-ft__nl-form input[type="email"] { flex: 0 0 auto; width: 100%; height: 46px; }
	html body .bx-ft-wrap .bx-ft__nl-form button { width: 100%; }
}
@media (max-width: 1100px) {
	html body .bx-ft__usps-in { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	html body .bx-ft__usp { padding: 16px 20px 16px 0; border-right: 0; border-bottom: 1px solid var(--bx-border); }
	html body .bx-ft__usp:nth-child(odd) { padding-left: 0; }
	html body .bx-ft__usp:nth-child(even) { padding-right: 0; padding-left: 20px; border-left: 1px solid var(--bx-border); }
	html body .bx-ft__usp:nth-last-child(-n+2):nth-child(odd), html body .bx-ft__usp:nth-last-child(-n+2):nth-child(odd) + .bx-ft__usp, html body .bx-ft__usp:last-child { border-bottom: 0; }
	html body .bx-ft__main { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 32px; }
	html body .bx-ft__brand, html body .bx-ft__aside { grid-column: 1 / -1; }
	html body .bx-ft__aside { flex-direction: row; align-items: flex-start; }
	html body .bx-ft__aside > * { flex: 1 1 0; }
	html body .bx-ft__bottom-in { justify-content: center; text-align: center; }
}
@media (max-width: 640px) {
	html body .bx-ft__usps-in { grid-template-columns: minmax(0, 1fr); }
	html body .bx-ft__usp, html body .bx-ft__usp:nth-child(even), html body .bx-ft__usp:nth-child(odd) { padding: 14px 0; border-left: 0; border-right: 0; border-bottom: 1px solid var(--bx-border); }
	html body .bx-ft__usp:last-child { border-bottom: 0; }
	html body .bx-ft__main { grid-template-columns: minmax(0, 1fr); gap: 28px; padding-bottom: 32px; }
	html body .bx-ft__aside { flex-direction: column; align-items: stretch; }
	html body .bx-ft__aside > * { flex: 0 0 auto; width: 100%; }
	html body .bx-ft__nl-form { flex-direction: column; }
	html body .bx-ft-wrap .bx-ft__nl-form input[type="email"] { flex: 0 0 auto; width: 100%; height: 46px; }
	html body .bx-ft-wrap .bx-ft__nl-form button { width: 100%; }
	html body .bx-ft__bottom-in { flex-direction: column; gap: 12px; }
	html body .bx-ft__pay, html body .bx-ft__legal { justify-content: center; }
}

/* ==================================================================
   Rey-thema: checkout-layout (ID-regels, clearfix, betaalblok, stappenbalk)
   ================================================================== */
html body .bx-co form.woocommerce-checkout::before, html body .bx-co form.woocommerce-checkout::after { content: none !important; display: none !important; }
html body .bx-co form.woocommerce-checkout #customer_details, html body .bx-co form.woocommerce-checkout #customer_details [class*="col-"] { float: none !important; width: auto !important; max-width: none !important; flex-basis: auto !important; margin: 0 !important; padding: 0 !important; }
html body .bx-co form.woocommerce-checkout #order_review_heading, html body .bx-co form.woocommerce-checkout .woocommerce-checkout-review-order { float: none !important; width: auto !important; }
html body .bx-co .woocommerce-checkout #order_review_heading { font-size: 22px !important; font-weight: 500 !important; text-transform: none !important; letter-spacing: normal !important; color: var(--bx-ink) !important; }
html body .bx-co .woocommerce-checkout #ship-to-different-address { font-size: 14px !important; text-transform: none !important; }
html body .bx-co .woocommerce-checkout #payment { background: transparent !important; border: 0 !important; border-radius: 0 !important; }
html body .bx-co .woocommerce-checkout #payment ul.payment_methods { margin: 0 !important; padding: 0 !important; border: 0 !important; }
html body .bx-co .woocommerce-checkout #payment ul.payment_methods .wc_payment_method > label { display: flex !important; margin: 0 0 10px !important; font-weight: 600 !important; line-height: 1.4 !important; vertical-align: baseline !important; }
html body .bx-co .woocommerce-checkout #payment div.form-row, html body .bx-co .woocommerce-checkout #payment .place-order { padding: 0 !important; }
html body .bx-co .woocommerce-checkout #payment .place-order #place_order { margin-top: 0 !important; padding: 18px !important; }
html body .bx-co .woocommerce-checkout #payment .place-order button[type="submit"]::before { content: none !important; display: none !important; }
html body .bx-co .woocommerce-checkout #payment div.payment_box { width: auto !important; border-radius: 10px !important; font-size: 13px !important; line-height: 1.5 !important; color: var(--bx-soft) !important; }
html body .bx-co .woocommerce-checkout #payment .woocommerce-terms-and-conditions-wrapper .woocommerce-terms-and-conditions-checkbox-text { font-size: 13px !important; font-weight: 400 !important; color: var(--bx-ink) !important; }
html body .bx-co .woocommerce-checkout #payment ul.payment_methods li.woocommerce-notice { margin: 0 0 12px !important; padding: 14px 16px !important; border: 1px solid var(--bx-line) !important; border-radius: 10px !important; background: #fff !important; font-size: 13.5px !important; color: var(--bx-soft) !important; }
html body .bx-co .rey-classic-reviewOrder-img, html body .bx-co .rey-checkoutBar-wrapper, html body .bx-cart .rey-checkoutBar-wrapper { display: none !important; }

/* ==================================================================
   Productpagina (.bx-pp) — ontwerp "Bioxcin Productpagina Boost.dc.html"
   ================================================================== */
html body .bx-pp {
	--bx-brand: #8B2332;
	--bx-brand-deep: #6E1A28;
	--bx-ink: #3B0D16;
	--bx-body: #2A1A1E;
	--bx-soft: #6B535A;
	--bx-line: #E6D5D9;
	--bx-mist: #F8F1F2;
	--bx-tint: #F7E9EB;
	--bx-ok: #2E8B57;
	--bx-ok-soft: #EAF4EA;
	--bx-tp: #00B67A;
	--bx-rose: #F1C9CF;
	--bx-rose-2: #C9A3AB;
	--bx-cream: #F5DFE2;
	--bx-maxw: 1440px;
	--bx-px: 56px;
	--bx-pp-rev-speed: 60s;

	font-family: 'Outfit', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
	font-size: 15px;
	line-height: 1.5;
	color: var(--bx-body);
	background: #fff;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}
html body .bx-pp *,
html body .bx-pp *::before,
html body .bx-pp *::after { box-sizing: border-box; }
html body .bx-pp p, html body .bx-pp h1, html body .bx-pp h2, html body .bx-pp h3, html body .bx-pp h4 { margin: 0; }
html body .bx-pp [hidden] { display: none !important; }
html body .bx-pp a { color: var(--bx-brand); text-decoration: none; }
html body .bx-pp a:hover { color: var(--bx-brand-deep); text-decoration: underline; }
html body .bx-pp button { font-family: inherit; cursor: pointer; }
html body .bx-pp img { display: block; max-width: 100%; height: auto; }
html body .bx-pp .bx-stars { color: var(--bx-brand); letter-spacing: 2px; white-space: nowrap; }
html body .bx-pp .bx-stars__empty { color: #E4CDD1; }
html body .bx-pp__in { max-width: var(--bx-maxw); margin: 0 auto; padding-left: var(--bx-px); padding-right: var(--bx-px); }
html body .bx-pp__main { padding-top: 20px; padding-bottom: 56px; }
html body .bx-pp__crumbs { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 22px; font-size: 13px; color: var(--bx-soft); }
html body .bx-pp__crumbs a { color: var(--bx-soft); }
html body .bx-pp__crumbs b { font-weight: 500; color: var(--bx-body); }
html body .bx-pp__top { display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(0, .95fr); gap: 56px; align-items: start; }

/* Galerij */
html body .bx-pp__gallery { position: sticky; top: 24px; min-width: 0; }
html body .bx-pp__stage { position: relative; aspect-ratio: 1 / 1; border: 1px solid var(--bx-line); border-radius: 24px; background: linear-gradient(180deg, #F8F1F2 0%, #FCF8F9 100%); overflow: hidden; }
html body .bx-pp__stage-in { position: absolute; inset: var(--bx-pp-inset, 0); }
html body .bx-pp .bx-pp__stage-in img { width: 100%; height: 100%; object-fit: var(--bx-pp-fit, cover); object-position: center; }
html body .bx-pp__badge { position: absolute; top: 18px; padding: 8px 14px; border-radius: 999px; color: #fff; font-size: 13px; font-weight: 600; line-height: 1.2; }
html body .bx-pp__badge--l { left: 18px; background: var(--bx-brand-deep); }
html body .bx-pp__badge--r { right: 18px; background: var(--bx-brand); font-weight: 700; }
html body .bx-pp__chips { position: absolute; left: 18px; right: 18px; bottom: 18px; display: flex; flex-wrap: wrap; gap: 8px; }
html body .bx-pp__chip { display: flex; align-items: center; gap: 6px; padding: 7px 12px; border: 1px solid var(--bx-line); border-radius: 999px; background: rgba(255, 255, 255, .9); backdrop-filter: blur(6px); font-size: 12px; font-weight: 600; color: var(--bx-ink); }
html body .bx-pp__chip-star { color: var(--bx-brand); }
html body .bx-pp__thumbs { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; margin-top: 14px; }
html body .bx-pp__thumb { position: relative; aspect-ratio: 1 / 1; min-width: 0; padding: var(--bx-pp-thumb-pad, 0); border: 1.5px solid var(--bx-line); border-radius: 14px; background: var(--bx-mist); overflow: hidden; transition: border-color .15s ease, box-shadow .15s ease; }
html body .bx-pp__thumb.is-on { border: 2px solid var(--bx-brand); box-shadow: 0 0 0 2px rgba(139, 35, 50, .12); }
html body .bx-pp .bx-pp__thumb img { width: 100%; height: 100%; object-fit: var(--bx-pp-fit, cover); object-position: center; border-radius: 10px; }
html body .bx-pp__stats { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; margin-top: 18px; }
html body .bx-pp__stat { padding: 16px 18px; border-radius: 16px; background: var(--bx-mist); }
html body .bx-pp__stat b { display: block; font-size: 28px; font-weight: 700; line-height: 1; color: var(--bx-brand); }
html body .bx-pp__stat span { display: block; margin-top: 4px; font-size: 12px; line-height: 1.45; color: var(--bx-soft); }

/* Koopzone */
html body .bx-pp__buy { display: flex; flex-direction: column; gap: 18px; min-width: 0; }
html body .bx-pp__kicker { font-size: 12px; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; color: var(--bx-brand); }
html body .bx-pp__kicker--sm { font-size: 11px; }
html body .bx-pp__title { margin-top: 8px; font-size: 38px; font-weight: 700; line-height: 1.1; letter-spacing: -.01em; color: var(--bx-ink); text-wrap: pretty; }
html body .bx-pp__intro { margin-top: 12px; font-size: 16px; line-height: 1.6; color: var(--bx-soft); text-wrap: pretty; }
html body .bx-pp__meta { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; margin-top: 14px; font-size: 14px; }
html body .bx-pp__meta .bx-stars { font-size: 15px; }
html body .bx-pp__meta b { color: var(--bx-ink); }
html body .bx-pp__meta a { font-weight: 500; text-decoration: underline; text-underline-offset: 3px; }
html body .bx-pp__sep { color: var(--bx-line); }
html body .bx-pp__stock { display: flex; align-items: center; gap: 6px; font-weight: 600; color: var(--bx-ok); }
html body .bx-pp__stock i { width: 8px; height: 8px; border-radius: 50%; background: currentColor; animation: bxPpPulse 2s infinite; }
html body .bx-pp__stock--back { color: #B98A18; }
html body .bx-pp__stock--out { color: #B3372F; }
html body .bx-pp__stock--out i { animation: none; }
@keyframes bxPpPulse { 0%, 100% { box-shadow: 0 0 0 0 rgba(46, 139, 87, .5); } 70% { box-shadow: 0 0 0 6px rgba(46, 139, 87, 0); } }
html body .bx-pp__usps { display: flex; flex-wrap: wrap; gap: 8px; }
html body .bx-pp__usp { display: flex; align-items: center; gap: 7px; padding: 7px 13px; border: 1.5px solid var(--bx-line); border-radius: 999px; background: #fff; font-size: 13px; font-weight: 500; }
html body .bx-pp__usp i { font-style: normal; color: var(--bx-ok); }
html body .bx-pp__card { display: flex; flex-direction: column; gap: 14px; padding: 18px; border: 1px solid var(--bx-line); border-radius: 22px; background: #fff; box-shadow: 0 18px 50px rgba(110, 26, 40, .08); }
html body .bx-pp__card-head { display: flex; justify-content: space-between; align-items: center; gap: 10px; }
html body .bx-pp__card-head b { font-size: 13px; font-weight: 600; color: var(--bx-ink); }
html body .bx-pp__card-head span { font-size: 12px; color: var(--bx-soft); }
html body .bx-pp__packs { display: flex; flex-direction: column; gap: 8px; }
html body .bx-pp__pack { display: flex; align-items: center; gap: 14px; width: 100%; padding: 14px 16px; border: 1.5px solid var(--bx-line); border-radius: 16px; background: #fff; color: inherit; text-align: left; transition: border-color .15s ease, background-color .15s ease, box-shadow .15s ease; }
html body .bx-pp__pack.is-on { border: 2px solid var(--bx-brand); background: var(--bx-mist); box-shadow: 0 0 0 3px rgba(139, 35, 50, .1); }
html body .bx-pp__radio { flex: none; width: 20px; height: 20px; border: 2px solid var(--bx-rose-2); border-radius: 50%; background: #fff; }
html body .bx-pp__pack.is-on .bx-pp__radio { border: 6px solid var(--bx-brand); }
html body .bx-pp__pack-txt { flex: 1; min-width: 0; }
html body .bx-pp__pack-title { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; font-size: 15px; font-weight: 600; color: var(--bx-ink); }
html body .bx-pp__pack-title em { padding: 3px 9px; border-radius: 999px; background: var(--bx-brand); color: #fff; font-size: 11px; font-style: normal; font-weight: 700; }
html body .bx-pp__pack-sub { display: block; margin-top: 3px; font-size: 13px; line-height: 1.45; color: var(--bx-soft); }
html body .bx-pp__pack-price { flex: none; text-align: right; }
html body .bx-pp__pack-price b { display: block; font-size: 17px; font-weight: 700; color: var(--bx-ink); }
html body .bx-pp__pack-price s { display: block; font-size: 12px; color: var(--bx-soft); }
html body .bx-pp__pack-price small { display: block; margin-top: 2px; font-size: 11px; font-weight: 600; color: var(--bx-brand); }
html body .bx-pp__subnote { display: flex; align-items: center; gap: 10px; padding: 10px 14px; border-radius: 12px; background: var(--bx-tint); font-size: 12px; color: var(--bx-ink); }
html body .bx-pp__subnote span { color: var(--bx-brand); }
html body .bx-pp__total { display: flex; justify-content: space-between; align-items: flex-end; gap: 12px; padding-top: 12px; border-top: 1px solid var(--bx-line); }
html body .bx-pp__total-row { display: flex; align-items: baseline; gap: 10px; }
html body .bx-pp__total-now { font-size: 34px; font-weight: 700; line-height: 1; color: var(--bx-ink); }
html body .bx-pp__total-old { font-size: 15px; color: var(--bx-soft); }
html body .bx-pp__total-note { margin-top: 6px; font-size: 12px; color: var(--bx-soft); }
html body .bx-pp__saving { padding: 6px 12px; border-radius: 999px; background: var(--bx-brand); color: #fff; font-size: 12px; font-weight: 700; white-space: nowrap; }
html body .bx-pp__actions { display: flex; gap: 10px; }
html body .bx-pp__qty { display: flex; flex: none; align-items: center; height: 54px; border: 1.5px solid var(--bx-line); border-radius: 999px; background: #fff; }
html body .bx-pp__qty-btn { width: 44px; height: 52px; border: 0; background: none; font-size: 18px; color: var(--bx-ink); }
html body .bx-pp__qty-val { width: 20px; text-align: center; font-size: 15px; font-weight: 600; }
html body .bx-pp__cta { display: flex; flex: 1; align-items: center; justify-content: center; gap: 10px; height: 54px; padding: 0 18px; border: 0; border-radius: 999px; background: var(--bx-brand); color: #fff !important; font-size: 15px; font-weight: 600; box-shadow: 0 10px 24px rgba(139, 35, 50, .25); transition: background-color .15s ease; }
html body .bx-pp__cta:hover { background: var(--bx-brand-deep); }
html body .bx-pp__cta[disabled] { opacity: .55; cursor: default; box-shadow: none; }
html body .bx-pp__cta.is-loading { opacity: .7; }
html body .bx-pp__wish { display: grid; flex: none; place-items: center; width: 54px; height: 54px; border: 1.5px solid var(--bx-line); border-radius: 50%; background: #fff; color: var(--bx-brand); transition: background-color .15s ease; }
html body .bx-pp__wish:hover { background: var(--bx-mist); }
html body .bx-pp__wish.--in-wishlist { --icon-fill: currentColor; }
html body .bx-pp__ship { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 8px 14px; font-size: 12px; color: var(--bx-soft); }
html body .bx-pp__ship > span { display: flex; align-items: center; gap: 6px; }
html body .bx-pp__ship svg { color: var(--bx-ok); }
html body .bx-pp__ship b { color: var(--bx-body); }
html body .bx-pp__klarna { padding: 2px 7px; border-radius: 4px; background: #FFB3C7; color: var(--bx-body); font-size: 11px; }
html body .bx-pp__trust { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; }
html body .bx-pp__trust > div { display: flex; align-items: center; gap: 10px; padding: 12px 14px; border-radius: 14px; background: var(--bx-mist); font-size: 12px; font-weight: 500; color: var(--bx-ink); }
html body .bx-pp__trust svg { flex: none; color: var(--bx-brand); }
html body .bx-pp__quote { display: flex; align-items: flex-start; gap: 14px; padding: 16px 18px; border: 1px solid var(--bx-line); border-radius: 18px; background: #fff; font-size: 14px; line-height: 1.55; }
html body .bx-pp__avatar { display: grid; flex: none; place-items: center; width: 44px; height: 44px; border-radius: 50%; background: var(--bx-rose); color: var(--bx-brand); font-weight: 700; }
html body .bx-pp__quote .bx-stars { font-size: 12px; letter-spacing: 1px; }
html body .bx-pp__quote > div > span { color: var(--bx-soft); }
html body .bx-pp__details { display: flex; flex-direction: column; border-top: 1px solid var(--bx-line); }
html body .bx-pp__det { border-bottom: 1px solid var(--bx-line); }
html body .bx-pp__acc-btn { display: flex; justify-content: space-between; align-items: center; gap: 12px; width: 100%; padding: 16px 0; border: 0; background: none; text-align: left; font-size: 14px; font-weight: 600; color: var(--bx-ink); }
html body .bx-pp__det .bx-pp__acc-btn > span { font-size: 18px; color: var(--bx-brand); }
html body .bx-pp__acc-panel p { padding: 0 0 16px; font-size: 14px; line-height: 1.7; color: var(--bx-soft); }

/* Secties */
html body .bx-pp__sec { padding: 72px 0; }
html body .bx-pp__h2 { font-size: 36px; font-weight: 700; line-height: 1.1; letter-spacing: -.01em; color: var(--bx-ink); text-wrap: pretty; }
html body .bx-pp__lead { margin-top: 16px; font-size: 16px; line-height: 1.7; color: var(--bx-soft); }
html body .bx-pp__sec-head { display: flex; justify-content: space-between; align-items: flex-end; gap: 20px; margin-bottom: 28px; }
html body .bx-pp__sec-head p { margin-top: 6px; font-size: 14px; color: var(--bx-soft); }
html body .bx-pp__link { font-size: 14px; font-weight: 600; white-space: nowrap; }
html body .bx-pp__sticky { position: sticky; top: 24px; }
html body .bx-pp__ing { background: var(--bx-mist); }
html body .bx-pp__ing-in { display: grid; grid-template-columns: 400px minmax(0, 1fr); gap: 64px; align-items: start; }
html body .bx-pp__ing .bx-pp__h2 { margin-top: 12px; font-size: 40px; line-height: 1.08; }
html body .bx-pp__ing-cards { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
html body .bx-pp__ing-card { padding: 26px; border: 1px solid var(--bx-line); border-radius: 20px; background: #fff; }
html body .bx-pp__ing-badge { display: grid; place-items: center; width: 44px; height: 44px; margin-bottom: 16px; border-radius: 12px; background: var(--bx-tint); color: var(--bx-brand); font-size: 13px; font-weight: 700; }
html body .bx-pp__ing-badge.is-green { background: var(--bx-ok-soft); color: var(--bx-ok); font-size: 16px; }
html body .bx-pp__ing-card h3 { margin-top: 6px; font-size: 18px; font-weight: 600; color: var(--bx-ink); }
html body .bx-pp__ing-card p { margin-top: 8px; font-size: 14px; line-height: 1.65; color: var(--bx-soft); }
html body .bx-pp__for-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px; }
html body .bx-pp__for-yes, html body .bx-pp__for-alt { padding: 30px; border-radius: 22px; }
html body .bx-pp__for-yes { background: linear-gradient(160deg, var(--bx-brand), var(--bx-brand-deep)); color: #fff; }
html body .bx-pp__for-alt { border: 1px solid var(--bx-line); background: #fff; }
html body .bx-pp__for-yes h3, html body .bx-pp__for-alt h3 { display: flex; align-items: center; gap: 12px; font-size: 20px; font-weight: 600; }
html body .bx-pp__for-yes h3 { color: #fff; }
html body .bx-pp__for-alt h3 { color: var(--bx-ink); }
html body .bx-pp__for-yes h3 span, html body .bx-pp__for-alt h3 span { display: grid; flex: none; place-items: center; width: 34px; height: 34px; border-radius: 50%; font-size: 15px; }
html body .bx-pp__for-yes h3 span { background: rgba(255, 255, 255, .16); }
html body .bx-pp__for-alt h3 span { background: var(--bx-mist); color: var(--bx-brand); }
html body .bx-pp__for-list { display: flex; flex-direction: column; gap: 12px; margin-top: 22px; font-size: 15px; line-height: 1.5; color: var(--bx-cream); }
html body .bx-pp__for-list > div { display: flex; gap: 12px; }
html body .bx-pp__for-list span { flex: none; color: var(--bx-rose); }
html body .bx-pp__alts { display: flex; flex-direction: column; gap: 10px; margin-top: 22px; }
html body .bx-pp__alts a { display: flex; justify-content: space-between; align-items: center; gap: 12px; padding: 14px 16px; border: 1px solid var(--bx-line); border-radius: 14px; color: var(--bx-body); font-size: 14px; transition: border-color .15s ease; }
html body .bx-pp__alts a:hover { border-color: var(--bx-brand); color: var(--bx-body); text-decoration: none; }
html body .bx-pp__alt-name { font-weight: 600; color: var(--bx-brand); white-space: nowrap; }
html body .bx-pp__alt-note { margin-top: 18px; font-size: 13px; color: var(--bx-soft); }
html body .bx-pp__alt-note a { font-weight: 600; }
html body .bx-pp__rel { padding-top: 8px; }
html body .bx-pp__rel-grid { display: grid; grid-template-columns: repeat(var(--bx-pp-rel-n, 3), minmax(0, 1fr)); gap: 16px; align-items: stretch; }
html body .bx-pp__rel-grid.has-bundle { grid-template-columns: repeat(var(--bx-pp-rel-n, 3), minmax(0, 1fr)) 320px; }
html body .bx-pp__rcard { display: flex; flex-direction: column; padding: 16px; border: 1px solid var(--bx-line); border-radius: 20px; background: #fff; transition: box-shadow .2s ease, border-color .2s ease; }
html body .bx-pp__rcard:hover { border-color: #fff; box-shadow: 0 18px 50px rgba(110, 26, 40, .12); }
html body .bx-pp__rimg { display: block; position: relative; height: 200px; padding: 0; border-radius: 14px; background: var(--bx-mist); overflow: hidden; }
html body .bx-pp .bx-pp__rimg img { width: 100%; height: 100%; object-fit: cover; object-position: center; }
html body .bx-pp__rcard .bx-pp__kicker { margin-top: 14px; }
html body .bx-pp__rcard h3 { margin-top: 4px; font-size: 16px; font-weight: 600; line-height: 1.3; color: var(--bx-ink); }
html body .bx-pp__rcard h3 a { color: inherit; }
html body .bx-pp__rcard p { flex: 1; margin-top: 6px; font-size: 13px; line-height: 1.55; color: var(--bx-soft); }
html body .bx-pp__rfoot { display: flex; justify-content: space-between; align-items: center; gap: 10px; margin-top: 14px; }
html body .bx-pp__rprice { display: flex; flex-wrap: wrap; align-items: baseline; gap: 8px; }
html body .bx-pp__rprice s { font-size: 12px; color: var(--bx-soft); }
html body .bx-pp__rprice b { font-size: 16px; color: var(--bx-ink); }
html body .bx-pp__rprice em { padding: 3px 8px; border-radius: 999px; background: var(--bx-brand); color: #fff; font-size: 10px; font-style: normal; font-weight: 700; }
html body .bx-pp__radd { display: grid; flex: none; place-items: center; width: 36px; height: 36px; border: 1.5px solid var(--bx-brand); border-radius: 999px; background: #fff; color: var(--bx-brand) !important; font-size: 16px; line-height: 1; transition: background-color .15s ease, color .15s ease; }
html body .bx-pp__radd:hover, html body .bx-pp__radd.is-added { background: var(--bx-brand); color: #fff !important; text-decoration: none; }
html body .bx-pp__radd.is-loading { opacity: .6; }
html body .bx-pp__bundle { position: relative; display: flex; flex-direction: column; padding: 28px; border-radius: 20px; background: var(--bx-ink); color: #fff; overflow: hidden; }
html body .bx-pp__glow { position: absolute; right: -30px; top: -30px; width: 140px; height: 140px; border-radius: 50%; background: radial-gradient(circle, rgba(255, 255, 255, .12), transparent 70%); }
html body .bx-pp__bundle .bx-pp__kicker { letter-spacing: .1em; }
html body .bx-pp__bundle h3 { margin-top: 10px; font-size: 24px; font-weight: 600; line-height: 1.15; color: #fff; }
html body .bx-pp__bundle p { flex: 1; margin-top: 10px; font-size: 13px; line-height: 1.6; color: var(--bx-cream); }
html body .bx-pp__bprice { display: flex; align-items: baseline; gap: 10px; }
html body .bx-pp__bprice s { font-size: 13px; color: var(--bx-rose-2); }
html body .bx-pp__bprice b { font-size: 30px; font-weight: 700; }
html body .bx-pp__bundle-add { margin-top: 14px; padding: 14px; border: 0; border-radius: 999px; background: #fff; color: var(--bx-ink) !important; font-size: 13px; font-weight: 700; transition: background-color .15s ease; }
html body .bx-pp__bundle-add:hover { background: var(--bx-cream); }
html body .bx-pp__bundle-add.is-loading { opacity: .7; }
html body .bx-pp__rev { position: relative; padding: 80px 0 88px; background: linear-gradient(135deg, #fff 0%, #F8E9EC 45%, #F3DCE1 100%); overflow: hidden; }
html body .bx-pp__rev-head { padding: 0 var(--bx-px); text-align: center; }
html body .bx-pp__eyebrow { font-size: 11px; font-weight: 700; letter-spacing: .16em; text-transform: uppercase; color: var(--bx-soft); }
html body .bx-pp__rev-head h2 { margin-top: 6px; font-size: 64px; font-weight: 800; line-height: 1.1; letter-spacing: -.01em; color: var(--bx-ink); }
html body .bx-pp__tp { display: inline-flex; gap: 4px; margin-top: 14px; }
html body .bx-pp__tp i { display: grid; place-items: center; width: 34px; height: 34px; border-radius: 3px; background: var(--bx-tp); }
html body .bx-pp__tp svg { width: 22px; height: 22px; }
html body .bx-pp__tp--sm { margin: 0; }
html body .bx-pp__tp--sm i { width: 24px; height: 24px; }
html body .bx-pp__tp--sm svg { width: 15px; height: 15px; }
html body .bx-pp__rev-head p { margin-top: 12px; font-size: 15px; color: var(--bx-soft); }
html body .bx-pp__rev-head p b { color: var(--bx-body); }
html body .bx-pp__rev-row { margin-top: 20px; overflow: hidden; }
html body .bx-pp__rev-row:first-of-type { margin-top: 44px; }
html body .bx-pp__rev-track { display: flex; width: max-content; animation: bxPpMarq var(--bx-pp-rev-speed) linear infinite; }
html body .bx-pp__rev-track.is-reverse { animation-direction: reverse; }
html body .bx-pp__rev-track:hover { animation-play-state: paused; }
@keyframes bxPpMarq { from { transform: translate3d(0, 0, 0); } to { transform: translate3d(-50%, 0, 0); } }
html body .bx-pp__rcv { flex: none; width: 420px; margin-right: 20px; padding: 26px 28px; border-radius: 18px; background: #fff; box-shadow: 0 10px 30px rgba(110, 26, 40, .06); }
html body .bx-pp__rcv h3 { margin-top: 16px; font-size: 18px; font-weight: 700; color: var(--bx-ink); }
html body .bx-pp__rcv p { margin-top: 8px; font-size: 14.5px; line-height: 1.6; color: var(--bx-soft); }
html body .bx-pp__rcv footer { display: flex; justify-content: space-between; gap: 10px; margin-top: 16px; font-size: 13px; }
html body .bx-pp__rcv footer b { font-weight: 600; color: var(--bx-body); }
html body .bx-pp__rcv footer span { display: inline-flex; align-items: center; gap: 6px; color: var(--bx-tp); }
html body .bx-pp__rcv footer svg { width: 14px; height: 14px; padding: 2px; border-radius: 50%; background: var(--bx-tp); }
html body .bx-pp__fade { position: absolute; top: 0; bottom: 0; width: 140px; z-index: 2; pointer-events: none; }
html body .bx-pp__fade--l { left: 0; background: linear-gradient(90deg, #fff, rgba(255, 255, 255, 0)); }
html body .bx-pp__fade--r { right: 0; background: linear-gradient(270deg, #F3DCE1, rgba(243, 220, 225, 0)); }
html body .bx-pp__faq-in { display: grid; grid-template-columns: 380px minmax(0, 1fr); gap: 72px; align-items: start; }
html body .bx-pp__faq .bx-pp__h2 { font-size: 40px; line-height: 1.08; }
html body .bx-pp__faq .bx-pp__lead { margin-top: 14px; font-size: 15px; }
html body .bx-pp__faq-btns { display: flex; flex-direction: column; gap: 8px; margin-top: 22px; }
html body .bx-pp__btn { display: flex; justify-content: space-between; align-items: center; gap: 10px; padding: 14px 18px; border-radius: 14px; background: var(--bx-brand); color: #fff !important; font-size: 14px; font-weight: 600; transition: background-color .15s ease; }
html body .bx-pp__btn:hover { background: var(--bx-brand-deep); color: #fff !important; text-decoration: none; }
html body .bx-pp__btn--line { border: 1.5px solid var(--bx-brand); background: #fff; color: var(--bx-brand) !important; }
html body .bx-pp__btn--line:hover { background: var(--bx-mist); color: var(--bx-brand) !important; }
html body .bx-pp__faq-list { display: flex; flex-direction: column; }
html body .bx-pp__faq-item, html body .bx-pp__faq-end { border-top: 1px solid var(--bx-line); }
html body .bx-pp__faq-btn { display: grid; grid-template-columns: 48px minmax(0, 1fr) 40px; align-items: center; gap: 16px; padding: 24px 0; color: var(--bx-ink); }
html body .bx-pp__faq-num { font-size: 13px; font-weight: 600; color: var(--bx-brand); }
html body .bx-pp__faq-q { font-size: 18px; font-weight: 600; line-height: 1.3; }
html body .bx-pp__faq-chev { display: grid; place-items: center; width: 40px; height: 40px; border: 1.5px solid var(--bx-line); border-radius: 50%; font-size: 20px; font-weight: 300; color: var(--bx-brand); transition: background-color .15s ease, border-color .15s ease, color .15s ease; }
html body .bx-pp__faq-btn[aria-expanded="true"] .bx-pp__faq-chev { background: var(--bx-brand); border-color: var(--bx-brand); color: #fff; }
html body .bx-pp__faq-item .bx-pp__acc-panel p { max-width: 720px; padding: 0 56px 26px 64px; font-size: 15px; line-height: 1.75; }

@media (max-width: 1100px) {
	html body .bx-pp__top { grid-template-columns: minmax(0, 1fr); gap: 32px; }
	html body .bx-pp__gallery, html body .bx-pp__sticky { position: static; }
	html body .bx-pp__ing-in, html body .bx-pp__faq-in { grid-template-columns: minmax(0, 1fr); gap: 32px; }
	html body .bx-pp__rel-grid, html body .bx-pp__rel-grid.has-bundle { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	html body .bx-pp__for-grid { grid-template-columns: minmax(0, 1fr); }
	html body .bx-pp__sec { padding: 48px 0; }
	html body .bx-pp__rev { padding: 56px 0 64px; }
	html body .bx-pp__rev-head h2 { font-size: 48px; }
}
@media (max-width: 640px) {
	html body .bx-pp__main { padding-top: 12px; padding-bottom: 36px; }
	html body .bx-pp__title { font-size: 30px; }
	html body .bx-pp__h2, html body .bx-pp__ing .bx-pp__h2, html body .bx-pp__faq .bx-pp__h2 { font-size: 28px; }
	html body .bx-pp__badge { padding: 6px 10px; font-size: 12px; }
	html body .bx-pp__stats, html body .bx-pp__trust, html body .bx-pp__ing-cards, html body .bx-pp__rel-grid, html body .bx-pp__rel-grid.has-bundle { grid-template-columns: minmax(0, 1fr); }
	html body .bx-pp__thumbs { gap: 8px; }
	html body .bx-pp__actions { flex-wrap: wrap; }
	html body .bx-pp__cta { flex: 1 1 100%; order: 3; }
	html body .bx-pp__total { flex-direction: column; align-items: flex-start; }
	html body .bx-pp__sec-head { flex-direction: column; align-items: flex-start; gap: 8px; }
	html body .bx-pp__for-yes, html body .bx-pp__for-alt { padding: 22px; }
	html body .bx-pp__rcv { width: 300px; padding: 20px; }
	html body .bx-pp__rev-head h2 { font-size: 40px; }
	html body .bx-pp__faq-btn { grid-template-columns: 32px minmax(0, 1fr) 36px; gap: 10px; padding: 18px 0; }
	html body .bx-pp__faq-q { font-size: 16px; }
	html body .bx-pp__faq-item .bx-pp__acc-panel p { padding: 0 0 20px 42px; }
}

/* ==================================================================
   Haaradvies-popup (.bx-hp) — ontwerp "Bioxcin Haaradvies Popup.html"
   ================================================================== */
html body .bx-hp {
	--bx-brand: #8B2332;
	--bx-brand-deep: #6E1A28;
	--bx-line: #EAD9DC;
	--bx-body: #2B1A1E;
	--bx-soft: #5A3F46;
	--bx-muted: #8A6E73;
	--bx-ok: #4E9A51;
	--bx-hp-off: 24px;
	--bx-hp-w: 380px;
	--bx-hp-zoom: .85;

	font-family: 'Outfit', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
	font-size: 14px;
	line-height: 1.5;
	color: var(--bx-body);
	-webkit-font-smoothing: antialiased;
}
html body .bx-hp *,
html body .bx-hp *::before,
html body .bx-hp *::after { box-sizing: border-box; }
html body .bx-hp p { margin: 0; }
html body .bx-hp [hidden] { display: none !important; }
html body .bx-hp a { text-decoration: none; }
html body .bx-hp button { font-family: inherit; cursor: pointer; }
html body .bx-hp__fab { zoom: var(--bx-hp-zoom); position: fixed; right: var(--bx-hp-off); bottom: var(--bx-hp-off); z-index: 9998; display: flex; align-items: center; gap: 12px; padding: 10px 20px 10px 10px; border: 0; border-radius: 50px; background: linear-gradient(135deg, var(--bx-brand), var(--bx-brand-deep)); color: #fff; text-align: left; box-shadow: 0 6px 20px rgba(110, 26, 40, .3); animation: bxHpFabIn .6s ease-out; transition: transform .2s ease, box-shadow .2s ease; }
html body .bx-hp__fab:hover { transform: translateY(-2px); box-shadow: 0 12px 36px rgba(110, 26, 40, .55); }
html body .bx-hp__fab-ic { position: relative; display: grid; flex: none; place-items: center; width: 42px; height: 42px; border-radius: 50%; background: rgba(255, 255, 255, .18); color: #fff; }
html body .bx-hp__fab-dot { position: absolute; top: -3px; right: -3px; width: 16px; height: 16px; border: 2.5px solid var(--bx-brand); border-radius: 50%; background: var(--bx-ok); animation: bxHpBadge 2s ease-in-out infinite; }
html body .bx-hp__fab-txt { display: flex; flex-direction: column; line-height: 1.1; }
html body .bx-hp__fab-txt > span:first-child { font-size: 13px; font-weight: 600; }
html body .bx-hp__fab-sub { display: flex; align-items: center; gap: 5px; margin-top: 3px; font-size: 11px; color: rgba(255, 255, 255, .78); }
html body .bx-hp__fab-sub i, html body .bx-hp__role i { width: 6px; height: 6px; border-radius: 50%; background: #7ED181; box-shadow: 0 0 0 2px rgba(126, 209, 129, .3); animation: bxHpDot 2s ease-in-out infinite; }
html body .bx-hp__dialog { zoom: var(--bx-hp-zoom); position: fixed; right: var(--bx-hp-off); bottom: var(--bx-hp-off); z-index: 10000; width: var(--bx-hp-w); max-width: calc(100vw - 32px); max-height: calc(100vh - 48px); border-radius: 22px; background: #fff; box-shadow: 0 24px 64px rgba(60, 10, 20, .28); overflow: auto; animation: bxHpIn .35s cubic-bezier(.16, 1, .3, 1); }
html body .bx-hp__head { position: relative; padding: 20px 22px 26px; background: linear-gradient(135deg, var(--bx-brand), var(--bx-brand-deep)); color: #fff; overflow: hidden; }
html body .bx-hp__close { position: absolute; top: 14px; right: 14px; z-index: 1; display: grid; place-items: center; width: 30px; height: 30px; border: 0; border-radius: 50%; background: rgba(255, 255, 255, .14); color: #fff; transition: background-color .15s ease; }
html body .bx-hp__close:hover { background: rgba(255, 255, 255, .26); }
html body .bx-hp__who { position: relative; display: flex; align-items: center; gap: 12px; }
html body .bx-hp__avatar { position: relative; display: grid; flex: none; place-items: center; width: 52px; height: 52px; border: 2px solid rgba(255, 255, 255, .5); border-radius: 50%; background: linear-gradient(135deg, #F1C9CF, #F8E6E9); color: var(--bx-brand); font-size: 20px; font-weight: 700; }
html body .bx-hp .bx-hp__avatar img { width: 100%; height: 100%; border-radius: 50%; object-fit: cover; }
html body .bx-hp__avatar i { position: absolute; right: -1px; bottom: -1px; width: 14px; height: 14px; border: 2.5px solid #7E1F2F; border-radius: 50%; background: var(--bx-ok); }
html body .bx-hp__name { font-size: 16px; font-weight: 600; line-height: 1.1; }
html body .bx-hp__role { display: flex; align-items: center; gap: 6px; margin-top: 3px; font-size: 12px; color: rgba(255, 255, 255, .72); }
html body .bx-hp__role span { display: inline-flex; align-items: center; gap: 4px; }
html body .bx-hp__bubble-wrap { position: relative; margin-top: -14px; padding: 0 18px; }
html body .bx-hp__bubble { padding: 14px 16px; border: 1px solid var(--bx-line); border-radius: 16px 16px 16px 4px; background: #fff; box-shadow: 0 8px 24px rgba(110, 26, 40, .08); }
html body .bx-hp__bubble p { font-size: 14px; line-height: 1.55; color: var(--bx-body); }
html body .bx-hp__typing { display: flex; align-items: center; gap: 6px; margin-top: 8px; font-size: 11px; color: var(--bx-muted); }
html body .bx-hp__typing span { display: inline-flex; gap: 3px; margin-left: 2px; }
html body .bx-hp__typing i { width: 4px; height: 4px; border-radius: 50%; background: var(--bx-brand); animation: bxHpTyping 1.4s infinite; }
html body .bx-hp__typing i:nth-child(2) { animation-delay: .2s; }
html body .bx-hp__typing i:nth-child(3) { animation-delay: .4s; }
html body .bx-hp__links { display: flex; flex-direction: column; gap: 8px; padding: 18px 18px 0; }
html body .bx-hp__link { display: grid; grid-template-columns: 44px minmax(0, 1fr) auto; align-items: center; gap: 14px; padding: 12px 14px; border: 1px solid var(--bx-line); border-radius: 16px; background: #fff; color: var(--bx-body) !important; transition: border-color .2s ease, box-shadow .2s ease, transform .2s ease; }
html body .bx-hp__link--wa:hover { border-color: var(--bx-ok); box-shadow: 0 8px 24px rgba(78, 154, 81, .16); transform: translateY(-1px); }
html body .bx-hp__link--mail:hover { border-color: var(--bx-brand); box-shadow: 0 8px 24px rgba(139, 35, 50, .14); transform: translateY(-1px); }
html body .bx-hp__link-ic { display: grid; place-items: center; width: 44px; height: 44px; border-radius: 12px; }
html body .bx-hp__link--wa .bx-hp__link-ic { background: var(--bx-ok); color: #fff !important; }
html body .bx-hp__link--mail .bx-hp__link-ic { background: #F7E9EB; color: var(--bx-brand) !important; }
html body .bx-hp__link-txt { min-width: 0; }
html body .bx-hp__link-txt b { display: block; font-size: 14px; font-weight: 600; color: var(--bx-body) !important; }
html body .bx-hp__link-txt small { display: block; margin-top: 2px; font-size: 12px; color: var(--bx-muted) !important; }
html body .bx-hp__chev { color: var(--bx-brand); }
html body .bx-hp__link--wa .bx-hp__chev { color: var(--bx-ok) !important; }
html body .bx-hp__cta-wrap { padding: 12px 18px 0; }
html body .bx-hp__cta { position: relative; display: flex; align-items: center; gap: 14px; padding: 16px 18px; border-radius: 16px; background: linear-gradient(135deg, var(--bx-brand), var(--bx-brand-deep)); color: #fff !important; overflow: hidden; transition: box-shadow .2s ease, transform .2s ease; }
html body .bx-hp__cta:hover { color: #fff !important; box-shadow: 0 12px 28px rgba(110, 26, 40, .3); transform: translateY(-1px); }
html body .bx-hp__cta-ic { display: grid; flex: none; place-items: center; width: 40px; height: 40px; border-radius: 50%; background: rgba(255, 255, 255, .14); color: #fff !important; }
html body .bx-hp__cta-txt { flex: 1; min-width: 0; }
html body .bx-hp__cta-txt b { display: block; font-size: 15px; font-weight: 600; }
html body .bx-hp__cta-txt small { display: block; margin-top: 2px; font-size: 12px; color: rgba(255, 255, 255, .75) !important; }
html body .bx-hp__cta-arrow { display: grid; flex: none; place-items: center; width: 32px; height: 32px; border-radius: 50%; background: #fff; color: var(--bx-brand-deep) !important; }
html body .bx-hp__note { display: flex; align-items: center; justify-content: center; gap: 6px; padding: 16px 18px 18px; font-size: 11px; color: var(--bx-muted); }
html body .bx-hp__note b { font-weight: 600; color: var(--bx-soft); }
html body .bx-hp__note svg { color: var(--bx-ok); }
@keyframes bxHpDot { 0%, 100% { opacity: 1; } 50% { opacity: .4; } }
@keyframes bxHpBadge { 0%, 100% { transform: scale(1); } 50% { transform: scale(1.18); } }
@keyframes bxHpIn { from { opacity: 0; transform: translateY(20px) scale(.95); } to { opacity: 1; transform: translateY(0) scale(1); } }
@keyframes bxHpFabIn { from { opacity: 0; transform: translateY(60px); } to { opacity: 1; transform: translateY(0); } }
@keyframes bxHpTyping { 0%, 60%, 100% { opacity: .3; transform: translateY(0); } 30% { opacity: 1; transform: translateY(-3px); } }
@media (max-width: 640px) {
	html body .bx-hp--no-mobile { display: none; }
	html body .bx-hp { --bx-hp-off: 16px; }
	html body .bx-hp__dialog { max-height: calc(100vh - 32px); }
}

/* ==================================================================
   Collectie / archief (.bx-ar) — ontwerp "Bioxcin Collectiepagina.dc.html"
   ================================================================== */
html body .bx-ar {
	--bx-brand: #8B2332;
	--bx-brand-deep: #6E1A28;
	--bx-body: #2B1A1E;
	--bx-soft: #5A3F46;
	--bx-muted: #8A6E73;
	--bx-line: #EAD9DC;
	--bx-surface: #F8F3F3;
	--bx-rose: #F1C9CF;
	--bx-cream: #F5DFE2;
	--bx-maxw: 1440px;
	--bx-px: 80px;
	--bx-ar-side: 260px;
	--bx-ar-hero-h: 300px;
	--bx-ar-cols: 3;

	font-family: 'Outfit', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
	font-size: 14px;
	line-height: 1.5;
	color: var(--bx-body);
	background: #fff;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}
html body .bx-ar *,
html body .bx-ar *::before,
html body .bx-ar *::after { box-sizing: border-box; }
html body .bx-ar p, html body .bx-ar h1, html body .bx-ar h2, html body .bx-ar h3 { margin: 0; }
html body .bx-ar [hidden] { display: none !important; }
html body .bx-ar a { color: var(--bx-brand); text-decoration: none; }
html body .bx-ar a:hover { color: var(--bx-brand-deep); text-decoration: underline; }
html body .bx-ar button { font-family: inherit; cursor: pointer; }
html body .bx-ar img { display: block; max-width: 100%; height: auto; }
html body .bx-ar .bx-stars { color: var(--bx-brand); letter-spacing: 1px; white-space: nowrap; }
html body .bx-ar .bx-stars__empty { color: #E4CDD1; }
html body .bx-ar__in { max-width: var(--bx-maxw); margin: 0 auto; padding-left: var(--bx-px); padding-right: var(--bx-px); }
html body .bx-ar__eyebrow { font-size: 11px; font-weight: 600; letter-spacing: .16em; text-transform: uppercase; color: var(--bx-brand); }
html body .bx-ar__eyebrow--light { font-size: 10px; letter-spacing: .14em; color: var(--bx-rose); }

/* Hero */
html body .bx-ar__hero { position: relative; min-height: var(--bx-ar-hero-h); background: var(--bx-brand-deep); color: #fff; overflow: hidden; }
html body .bx-ar__hero-bg { position: absolute; inset: 0; }
html body .bx-ar .bx-ar__hero-bg img { width: 100%; height: 100%; object-fit: cover; }
html body .bx-ar__hero-shade { position: absolute; inset: 0; pointer-events: none; background: linear-gradient(90deg, color-mix(in srgb, var(--bx-brand-deep) 94%, transparent) 0%, color-mix(in srgb, var(--bx-brand-deep) 70%, transparent) 55%, color-mix(in srgb, var(--bx-brand-deep) 20%, transparent) 100%); }
html body .bx-ar__hero--plain .bx-ar__hero-shade { display: none; }
html body .bx-ar__hero-in { position: relative; display: flex; flex-direction: column; gap: 14px; padding-top: 52px; padding-bottom: 52px; }
html body .bx-ar__crumbs { font-size: 12px; color: var(--bx-rose); }
html body .bx-ar__crumbs a { color: inherit; }
html body .bx-ar__crumbs span { color: #fff; }
html body .bx-ar__hero h1 { font-size: 48px; font-weight: 700; line-height: 1.05; color: #fff; }
html body .bx-ar__hero p { max-width: 560px; font-size: 15px; line-height: 1.65; color: var(--bx-cream); }
html body .bx-ar__chips { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 6px; }
html body .bx-ar__chips button { padding: 9px 16px; border: 1.5px solid rgba(255, 255, 255, .45); border-radius: 999px; background: transparent; color: #fff; font-size: 12px; font-weight: 500; transition: background-color .15s ease, color .15s ease, border-color .15s ease; }
html body .bx-ar__chips button:hover { border-color: #fff; }
html body .bx-ar__chips button.is-on { border-color: #fff; background: #fff; color: var(--bx-brand-deep); }

/* Layout */
html body .bx-ar__main { display: grid; grid-template-columns: var(--bx-ar-side) minmax(0, 1fr); gap: 48px; padding-top: 48px; padding-bottom: 72px; align-items: start; }
html body .bx-ar__content { min-width: 0; }

/* Zijbalk */
html body .bx-ar__side { display: flex; flex-direction: column; gap: 28px; font-size: 13px; }
html body .bx-ar__side-head { display: flex; justify-content: space-between; align-items: baseline; gap: 10px; padding-bottom: 14px; border-bottom: 1px solid var(--bx-line); }
html body .bx-ar__side-head > span { font-size: 15px; font-weight: 700; color: var(--bx-brand-deep); }
html body .bx-ar__reset--link { margin-left: auto; padding: 0; border: 0; background: none; color: var(--bx-brand); font-size: 12px; font-weight: 500; text-decoration: underline; }
html body .bx-ar__side-close { display: none; width: 32px; height: 32px; border: 1px solid var(--bx-line); border-radius: 50%; background: #fff; color: var(--bx-body); font-size: 13px; }
html body .bx-ar__group-title { margin-bottom: 12px; font-size: 12px; font-weight: 600; color: var(--bx-brand-deep); }
html body .bx-ar__opts { display: flex; flex-direction: column; gap: 10px; }
html body .bx-ar__opt { position: relative; display: flex; align-items: center; gap: 10px; cursor: pointer; font-size: 13px; color: var(--bx-body); }
html body .bx-ar__opt input, html body .bx-ar__pill input, html body .bx-ar__switch input { position: absolute; width: 0; height: 0; opacity: 0; pointer-events: none; }
html body .bx-ar__box { display: grid; flex: none; place-items: center; width: 18px; height: 18px; border: 1.5px solid #D9BFC4; border-radius: 5px; background: #fff; color: #fff; font-size: 11px; line-height: 1; transition: background-color .15s ease, border-color .15s ease; }
html body .bx-ar__opt.is-on .bx-ar__box { border-color: var(--bx-brand); background: var(--bx-brand); }
html body .bx-ar__opt-label { flex: 1; }
html body .bx-ar__opt-n { font-size: 11px; color: var(--bx-muted); }
html body .bx-ar__pills { display: flex; flex-wrap: wrap; gap: 8px; }
html body .bx-ar__pill { position: relative; cursor: pointer; }
html body .bx-ar__pill span { display: inline-block; padding: 8px 14px; border: 1.5px solid #D9BFC4; border-radius: 999px; background: #fff; color: var(--bx-body); font-size: 12px; font-weight: 500; transition: background-color .15s ease, color .15s ease, border-color .15s ease; }
html body .bx-ar__pill.is-on span { border-color: var(--bx-brand); background: var(--bx-brand); color: #fff; }
html body .bx-ar__switch { position: relative; display: flex; justify-content: space-between; align-items: center; gap: 12px; padding: 14px 16px; border: 1px solid var(--bx-line); border-radius: 12px; background: var(--bx-surface); cursor: pointer; font-size: 13px; font-weight: 500; color: var(--bx-body); }
html body .bx-ar__switch i { position: relative; flex: none; width: 36px; height: 20px; border-radius: 999px; background: #D9BFC4; transition: background-color .15s ease; }
html body .bx-ar__switch i::after { content: ""; position: absolute; top: 2px; left: 2px; width: 16px; height: 16px; border-radius: 50%; background: #fff; transition: transform .15s ease; }
html body .bx-ar__switch.is-on i { background: var(--bx-brand); }
html body .bx-ar__switch.is-on i::after { transform: translateX(16px); }
html body .bx-ar__promo { padding: 22px; border-radius: 16px; background: linear-gradient(135deg, var(--bx-brand-deep), var(--bx-brand)); color: #fff; }
html body .bx-ar__promo h3 { margin-top: 8px; font-size: 19px; font-weight: 600; line-height: 1.25; color: #fff; }
html body .bx-ar__promo p { margin-top: 8px; font-size: 12px; line-height: 1.6; color: var(--bx-cream); }
html body .bx-ar__promo a { display: inline-block; margin-top: 14px; padding: 11px 18px; border-radius: 999px; background: #fff; color: var(--bx-brand-deep) !important; font-size: 12px; font-weight: 600; }
html body .bx-ar__promo a:hover { background: var(--bx-cream); color: var(--bx-brand-deep) !important; text-decoration: none; }

/* Balk, actieve filters, leeg */
html body .bx-ar__bar { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 12px; margin-bottom: 22px; padding-bottom: 14px; border-bottom: 1px solid var(--bx-line); }
html body .bx-ar__filters-btn { display: none; align-items: center; gap: 8px; padding: 9px 14px; border: 1px solid var(--bx-line); border-radius: 999px; background: #fff; color: var(--bx-body); font-size: 13px; font-weight: 500; }
html body .bx-ar__filters-btn em { padding: 1px 7px; border-radius: 999px; background: var(--bx-brand); color: #fff; font-size: 11px; font-style: normal; }
html body .bx-ar__count-wrap { font-size: 13px; color: var(--bx-muted); }
html body .bx-ar__count-wrap b { color: var(--bx-body); }
html body .bx-ar__sort { display: flex; align-items: center; gap: 6px; padding: 4px; border-radius: 999px; background: var(--bx-surface); }
html body .bx-ar__sort button { padding: 7px 14px; border: 0; border-radius: 999px; background: transparent; color: var(--bx-muted); font-size: 12px; font-weight: 500; transition: background-color .15s ease, color .15s ease; }
html body .bx-ar__sort button.is-on { background: #fff; color: var(--bx-brand-deep); font-weight: 600; box-shadow: 0 2px 8px rgba(110, 26, 40, .12); }
html body .bx-ar__active { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 20px; }
html body .bx-ar__active button { padding: 6px 12px; border: 1px solid var(--bx-brand); border-radius: 999px; background: #fff; color: var(--bx-brand); font-size: 11px; font-weight: 500; }
html body .bx-ar__active button:hover { background: var(--bx-brand); color: #fff; }
html body .bx-ar__empty { padding: 80px 0; text-align: center; color: var(--bx-muted); }
html body .bx-ar__empty > div { font-size: 26px; font-weight: 700; color: var(--bx-brand-deep); }
html body .bx-ar__empty p { margin-top: 10px; font-size: 14px; }
html body .bx-ar__empty button { margin-top: 18px; padding: 12px 22px; border: 1.5px solid var(--bx-brand); border-radius: 999px; background: none; color: var(--bx-brand); font-size: 13px; font-weight: 600; }

/* Kaarten */
html body .bx-ar__grid { display: grid; grid-template-columns: repeat(var(--bx-ar-cols), minmax(0, 1fr)); gap: 20px; }
html body .bx-ar__card { position: relative; display: flex; flex-direction: column; padding: 16px; border: 1px solid var(--bx-line); border-radius: 16px; background: #fff; transition: box-shadow .2s ease, border-color .2s ease; }
html body .bx-ar__card:hover { border-color: #fff; box-shadow: 0 14px 36px rgba(110, 26, 40, .12); }
html body .bx-ar__badge { position: absolute; top: 26px; left: 26px; z-index: 1; padding: 4px 10px; border-radius: 999px; background: var(--bx-brand); color: #fff; font-size: 11px; font-weight: 600; }
html body .bx-ar__wish { position: absolute; top: 24px; right: 24px; z-index: 1; display: grid; place-items: center; width: 32px; height: 32px; padding: 0; border: 1px solid var(--bx-line); border-radius: 50%; background: #fff; color: var(--bx-brand); }
html body .bx-ar__wish.--in-wishlist { --icon-fill: currentColor; }
html body .bx-ar__img { display: block; height: 240px; padding: var(--bx-ar-img-pad, 0); border-radius: 12px; background: var(--bx-surface); overflow: hidden; }
html body .bx-ar .bx-ar__img img { width: 100%; height: 100%; object-fit: var(--bx-ar-fit, cover); object-position: center; }
html body .bx-ar__cat { margin-top: 14px; font-size: 11px; font-weight: 500; color: var(--bx-brand); }
html body .bx-ar__card h3 { margin-top: 4px; font-size: 15px; font-weight: 600; line-height: 1.35; color: var(--bx-brand-deep); }
html body .bx-ar__card h3 a { color: inherit; }
html body .bx-ar__card p { flex: 1; margin-top: 6px; font-size: 12px; line-height: 1.6; color: var(--bx-muted); }
html body .bx-ar__rating { display: flex; align-items: center; gap: 6px; margin-top: 10px; font-size: 11px; color: var(--bx-muted); }
html body .bx-ar__foot { display: flex; justify-content: space-between; align-items: center; gap: 10px; margin-top: 12px; }
html body .bx-ar__price { display: flex; flex-wrap: wrap; align-items: baseline; gap: 8px; }
html body .bx-ar__price s { font-size: 12px; color: var(--bx-muted); }
html body .bx-ar__price b { font-size: 17px; color: var(--bx-brand-deep); }
html body .bx-ar__add { display: inline-flex; align-items: center; justify-content: center; padding: 10px 16px; border: 0; border-radius: 999px; background: var(--bx-brand); color: #fff !important; font-size: 12px; font-weight: 600; white-space: nowrap; transition: background-color .15s ease, color .15s ease; }
html body .bx-ar__add:hover { background: var(--bx-brand-deep); color: #fff !important; text-decoration: none; }
html body .bx-ar__add.is-loading { opacity: .7; }
html body .bx-ar__add.is-added { background: #2E7D4F; }
html body .bx-ar__add--line { border: 1.5px solid var(--bx-brand); background: #fff; color: var(--bx-brand) !important; }
html body .bx-ar__add.is-off { background: var(--bx-surface); color: var(--bx-muted) !important; cursor: default; }
html body .bx-ar__more { display: flex; flex-direction: column; align-items: center; gap: 12px; margin-top: 40px; }
html body .bx-ar__more span { font-size: 12px; color: var(--bx-muted); }
html body .bx-ar__more button { padding: 14px 28px; border: 1.5px solid var(--bx-brand); border-radius: 999px; background: #fff; color: var(--bx-brand) !important; font-size: 13px; font-weight: 600; transition: background-color .15s ease, color .15s ease; }
html body .bx-ar__more button:hover { background: var(--bx-brand); color: #fff !important; }
html body .bx-ar__more button.is-loading { opacity: .6; }

/* Adviessectie */
html body .bx-ar__cta { display: grid; grid-template-columns: minmax(0, 1fr) 380px; gap: 48px; align-items: center; margin: 0 0 80px; padding: 48px 56px; border-radius: 20px; background: var(--bx-surface); }
html body .bx-ar__cta--noimg { grid-template-columns: minmax(0, 1fr); }
html body .bx-ar__cta h2 { margin-top: 10px; font-size: 34px; font-weight: 700; line-height: 1.1; color: var(--bx-brand-deep) !important; }
html body .bx-ar__cta p { max-width: 560px; margin-top: 12px; font-size: 14px; line-height: 1.65; color: var(--bx-soft) !important; }
html body .bx-ar__cta-btns { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 22px; }
html body .bx-ar__btn { display: inline-flex; align-items: center; padding: 14px 24px; border: 0; border-radius: 999px; background: var(--bx-brand); color: #fff !important; font-size: 13px; font-weight: 600; transition: background-color .15s ease, color .15s ease; }
html body .bx-ar__btn:hover { background: var(--bx-brand-deep); color: #fff !important; text-decoration: none; }
html body .bx-ar__btn--line { border: 1.5px solid var(--bx-brand); background: transparent; color: var(--bx-brand) !important; }
html body .bx-ar__btn--line:hover { background: #fff; color: var(--bx-brand) !important; }
html body .bx-ar__cta-img { height: 260px; border-radius: 16px; overflow: hidden; }
html body .bx-ar .bx-ar__cta-img img { width: 100%; height: 100%; object-fit: cover; }

@media (max-width: 1100px) {
	html body .bx-ar__main { grid-template-columns: minmax(0, 1fr); gap: 0; padding-top: 28px; }
	html body .bx-ar__side { display: none; }
	html body .bx-ar__side.is-open { display: flex; position: fixed; inset: 0; z-index: 99990; padding: 20px; background: #fff; overflow: auto; }
	html body .bx-ar__side.is-open .bx-ar__side-close { display: grid; place-items: center; }
	html body .bx-ar__filters-btn { display: inline-flex; }
	html body .bx-ar__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	html body .bx-ar__hero h1 { font-size: 36px; }
	html body .bx-ar__hero-in { padding-top: 36px; padding-bottom: 36px; }
	html body .bx-ar__cta, html body .bx-ar__cta--noimg { grid-template-columns: minmax(0, 1fr); gap: 24px; padding: 32px; margin-bottom: 48px; }
	html body .bx-ar__cta h2 { font-size: 28px; }
}
@media (max-width: 640px) {
	html body .bx-ar__grid { grid-template-columns: minmax(0, 1fr); gap: 14px; }
	html body .bx-ar__img { height: 200px; }
	html body .bx-ar__hero h1 { font-size: 30px; }
	html body .bx-ar__bar { gap: 10px; }
	html body .bx-ar__sort { width: 100%; justify-content: space-between; }
	html body .bx-ar__sort button { flex: 1; padding: 7px 8px; }
	html body .bx-ar__cta { padding: 24px; }
	html body .bx-ar__cta-img { height: 200px; }
}

/* ==================================================================
   Banner (.bx-bn) — ontwerp "Bioxcin Secties.dc.html", sectie Banner
   ================================================================== */
html body .bx-bn {
	--bx-bn-bg: #3B0D16;
	--bx-bn-accent: #F1C9CF;
	--bx-bn-soft: #F5DFE2;
	--bx-bn-btn: #6E1A28;
	--bx-bn-dot: #7ED181;
	--bx-bn-h: 820px;
	--bx-bn-overlay: 1;
	--bx-bn-pos: center center;
	--bx-maxw: 1440px;
	--bx-px: 56px;
	--bx-top-offset: 0px;

	position: relative;
	display: flex;
	flex-direction: column;
	min-height: var(--bx-bn-h);
	background: var(--bx-bn-bg);
	color: #fff;
	overflow: hidden;
	font-family: 'Outfit', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
	font-size: 16px;
	line-height: 1.5;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}
html body .bx-bn--screen { min-height: calc(100vh - var(--bx-top-offset)); min-height: calc(100svh - var(--bx-top-offset)); }
html body .bx-bn *,
html body .bx-bn *::before,
html body .bx-bn *::after { box-sizing: border-box; }
html body .bx-bn p, html body .bx-bn h1 { margin: 0; }
html body .bx-bn a { color: inherit; text-decoration: none; }
html body .bx-bn__bg { position: absolute; inset: 0; }
html body .bx-bn .bx-bn__img { display: block; width: 100%; height: 100%; max-width: none; object-fit: cover; object-position: var(--bx-bn-pos); }
html body .bx-bn__shade { position: absolute; inset: 0; pointer-events: none; background: linear-gradient(180deg, color-mix(in srgb, var(--bx-bn-bg) calc(55% * var(--bx-bn-overlay)), transparent) 0%, color-mix(in srgb, var(--bx-bn-bg) calc(25% * var(--bx-bn-overlay)), transparent) 35%, color-mix(in srgb, var(--bx-bn-bg) calc(35% * var(--bx-bn-overlay)), transparent) 62%, color-mix(in srgb, var(--bx-bn-bg) calc(85% * var(--bx-bn-overlay)), transparent) 100%); }
html body .bx-bn__vignette { position: absolute; inset: 0; pointer-events: none; background: radial-gradient(90% 70% at 50% 58%, transparent 40%, color-mix(in srgb, var(--bx-bn-bg) calc(35% * var(--bx-bn-overlay)), transparent) 100%); }
html body .bx-bn__body { position: relative; display: flex; flex: 1; flex-direction: column; justify-content: center; align-items: center; gap: clamp(14px, 2.6vh, 26px); width: 100%; max-width: var(--bx-maxw); margin: 0 auto; padding: clamp(24px, 4.5vh, 48px) var(--bx-px) clamp(20px, 3.5vh, 40px); text-align: center; }
html body .bx-bn--left .bx-bn__body { align-items: flex-start; text-align: left; }
html body .bx-bn__badge { display: inline-flex; align-items: center; gap: 8px; padding: 8px 16px; border: 1px solid rgba(255, 255, 255, .25); border-radius: 999px; background: rgba(255, 255, 255, .12); backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px); font-size: 13px; font-weight: 600; white-space: nowrap; }
html body .bx-bn__badge i { width: 8px; height: 8px; border-radius: 50%; background: var(--bx-bn-dot); }
html body .bx-bn__title { max-width: 18ch; font-size: clamp(36px, min(6.4vw, 9.5vh), 92px); font-weight: 700; line-height: 1; letter-spacing: -.025em; color: #fff; text-wrap: balance; text-shadow: 0 2px 40px rgba(59, 13, 22, .4); }
html body .bx-bn__title em { font-style: normal; color: var(--bx-bn-accent); }
html body .bx-bn__text { max-width: 56ch; font-size: clamp(15px, 2.1vh, 19px); line-height: 1.65; color: var(--bx-bn-soft); text-shadow: 0 1px 18px rgba(59, 13, 22, .6); }
html body .bx-bn__btns { display: flex; flex-wrap: wrap; justify-content: center; gap: 12px; margin-top: 8px; }
html body .bx-bn--left .bx-bn__btns { justify-content: flex-start; }
html body .bx-bn__btn { display: inline-flex; align-items: center; gap: 10px; padding: clamp(13px, 1.9vh, 18px) 32px; border-radius: 999px; background: #fff; color: var(--bx-bn-btn) !important; font-size: 16px; font-weight: 600; white-space: nowrap; transition: background-color .15s ease, color .15s ease; }
html body .bx-bn__btn:hover { background: var(--bx-bn-soft); color: var(--bx-bn-btn) !important; text-decoration: none; }
html body .bx-bn__btn--glass { border: 1px solid rgba(255, 255, 255, .5); background: rgba(255, 255, 255, .12); backdrop-filter: blur(6px); -webkit-backdrop-filter: blur(6px); color: #fff !important; }
html body .bx-bn__btn--glass:hover { background: rgba(255, 255, 255, .22); color: #fff !important; }
html body .bx-bn__bar { position: relative; display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 24px 32px; width: 100%; max-width: var(--bx-maxw); margin: 0 auto; padding: 0 var(--bx-px) clamp(20px, 3.5vh, 40px); }
html body .bx-bn__rating { display: flex; flex-direction: column; gap: 5px; }
html body .bx-bn__stars { font-size: 15px; letter-spacing: 3px; color: var(--bx-bn-accent); }
html body .bx-bn__rating-txt { font-size: 12px; letter-spacing: .1em; text-transform: uppercase; color: var(--bx-bn-soft); }
html body .bx-bn__stats { display: flex; flex-wrap: wrap; align-items: center; gap: 24px 48px; }
html body .bx-bn__stat { display: flex; flex-direction: column; gap: 2px; text-align: center; }
html body .bx-bn__stat b { font-size: clamp(26px, 3.6vh, 36px); font-weight: 700; line-height: 1; color: #fff; }
html body .bx-bn__stat span { font-size: 11px; letter-spacing: .12em; text-transform: uppercase; color: var(--bx-bn-soft); }
html body .bx-bn__sep { width: 1px; height: clamp(32px, 4.4vh, 44px); background: rgba(255, 255, 255, .3); }

@media (max-width: 1100px) {
	html body .bx-bn__body { gap: 20px; padding-top: 40px; padding-bottom: 32px; }
	html body .bx-bn__text { font-size: 17px; }
	html body .bx-bn__bar { justify-content: center; text-align: center; }
	html body .bx-bn__rating { align-items: center; }
	html body .bx-bn__stats { justify-content: center; gap: 20px 32px; }
	html body .bx-bn__stat b { font-size: 30px; }
}
@media (max-width: 640px) {
	html body .bx-bn__body { gap: 16px; padding-top: 32px; padding-bottom: 28px; }
	html body .bx-bn__badge { font-size: 12px; white-space: normal; text-align: center; }
	html body .bx-bn__title { font-size: clamp(34px, 11vw, 44px); }
	html body .bx-bn__text { font-size: 15px; }
	html body .bx-bn__btns { flex-direction: column; align-items: stretch; width: 100%; }
	html body .bx-bn__btn { justify-content: center; padding: 15px 24px; font-size: 15px; }
	html body .bx-bn__bar { padding-bottom: 28px; gap: 18px; }
	html body .bx-bn__stats { gap: 14px 18px; }
	html body .bx-bn__sep { height: 32px; }
	html body .bx-bn__stat b { font-size: 24px; }
	html body .bx-bn__stat span { font-size: 10px; }
}

/* Banner: uitbreken uit een boxed container (optie "Altijd volledige schermbreedte"). */
html body .bx-bn--bleed {
	width: var(--bx-vw, 100vw);
	max-width: none;
	margin-left: calc(50% - var(--bx-vw, 100vw) / 2);
	margin-right: calc(50% - var(--bx-vw, 100vw) / 2);
}

/* ==================================================================
   Instagram (.bx-ig) — ontwerp "Bioxcin Secties.dc.html", sectie Instagram
   ================================================================== */
html body .bx-ig {
	--bx-ig-bg1: #FFFFFF;
	--bx-ig-bg2: #F8F3F3;
	--bx-ig-border: #EAD9DC;
	--bx-ig-border-w: 1px;
	--bx-ig-title: #6E1A28;
	--bx-ig-accent: #8B2332;
	--bx-ig-ph: #EAD9DC;
	--bx-ig-h: 380px;
	--bx-ig-gap: 18px;
	--bx-ig-radius: 18px;
	--bx-ig-py: 80px;
	--bx-ig-speed: 64s;
	position: relative;
	overflow: hidden;
	margin: 0;
	padding: calc(var(--bx-ig-py) - 6px) 0 var(--bx-ig-py);
	border-top: var(--bx-ig-border-w) solid var(--bx-ig-border);
	border-bottom: var(--bx-ig-border-w) solid var(--bx-ig-border);
	background: linear-gradient(180deg, var(--bx-ig-bg1) 0%, var(--bx-ig-bg2) 100%);
	font-family: 'Outfit', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
	color: var(--bx-ig-title);
	line-height: 1.5;
	-webkit-font-smoothing: antialiased;
}
html body .bx-ig *,
html body .bx-ig *::before,
html body .bx-ig *::after { box-sizing: border-box; }
html body .bx-ig__glow {
	position: absolute;
	inset: 0;
	pointer-events: none;
	background: radial-gradient(1100px 420px at 50% 100%, color-mix(in srgb, var(--bx-ig-accent) 8%, transparent), transparent 70%);
}
html body .bx-ig__head {
	position: relative;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 13px;
	margin: 0 0 32px;
	padding: 0 24px;
	text-align: center;
}
html body .bx-ig__head h2 {
	margin: 0;
	font-family: inherit;
	font-size: 42px;
	font-weight: 700;
	line-height: 1.15;
	letter-spacing: -.01em;
	color: var(--bx-ig-title);
	text-transform: none;
}
html body .bx-ig__head h2 em { font-style: normal; color: var(--bx-ig-accent); }
html body .bx-ig__handle,
html body .bx-ig__handle:visited {
	display: inline-flex;
	align-items: center;
	gap: 9px;
	padding: 0 0 6px;
	border-bottom: 1.5px solid color-mix(in srgb, var(--bx-ig-accent) 40%, transparent);
	font-size: 12px;
	font-weight: 600;
	letter-spacing: .16em;
	text-transform: uppercase;
	text-decoration: none;
	color: var(--bx-ig-accent) !important;
	transition: color .2s ease, border-color .2s ease;
}
html body .bx-ig__handle:hover,
html body .bx-ig__handle:focus-visible {
	color: var(--bx-ig-title) !important;
	border-bottom-color: var(--bx-ig-title);
	text-decoration: none;
}
html body .bx-ig__handle svg { width: 15px; height: 15px; flex: 0 0 auto; }
html body .bx-ig__viewport {
	position: relative;
	overflow: hidden;
}
html body .bx-ig--fade .bx-ig__viewport {
	-webkit-mask-image: linear-gradient(90deg, transparent 0, #000 8%, #000 92%, transparent 100%);
	mask-image: linear-gradient(90deg, transparent 0, #000 8%, #000 92%, transparent 100%);
}
html body .bx-ig__track {
	display: flex;
	align-items: center;
	gap: var(--bx-ig-gap);
	width: max-content;
	margin: 0;
	padding: 0;
	animation: bxIgMedia var(--bx-ig-speed) linear infinite;
	will-change: transform;
}
html body .bx-ig--pause .bx-ig__viewport:hover .bx-ig__track { animation-play-state: paused; }
@keyframes bxIgMedia {
	from { transform: translate3d(0, 0, 0); }
	to { transform: translate3d(calc(-50% - var(--bx-ig-gap) / 2), 0, 0); }
}
html body .bx-ig__tile,
html body .bx-ig__tile:visited {
	position: relative;
	display: block;
	flex: none;
	width: calc(var(--bx-ig-h) * 300 / 380);
	height: var(--bx-ig-h);
	margin: 0;
	overflow: hidden;
	border-radius: var(--bx-ig-radius);
	background: var(--bx-ig-ph);
	color: var(--bx-ig-title);
	text-decoration: none;
	transition: opacity .25s ease;
}
html body .bx-ig__tile--small {
	width: calc(var(--bx-ig-h) * 260 / 380);
	height: calc(var(--bx-ig-h) * 260 / 380);
}
html body .bx-ig__tile:hover { opacity: .92; }
html body .bx-ig__tile img {
	position: absolute;
	inset: 0;
	display: block;
	width: 100%;
	height: 100%;
	max-width: none;
	margin: 0;
	object-fit: cover;
	border-radius: 0;
}
html body .bx-ig__frame {
	position: absolute;
	inset: 10px;
	pointer-events: none;
	border: 1px solid rgba(255, 255, 255, .5);
	border-radius: max(0px, calc(var(--bx-ig-radius) - 6px));
}
html body .bx-ig__ph {
	position: absolute;
	inset: 0;
	display: flex;
	align-items: flex-end;
	padding: 18px;
	font-size: 12px;
	font-weight: 500;
	letter-spacing: .04em;
	line-height: 1.35;
	color: var(--bx-ig-title);
	background: linear-gradient(160deg, #F8F3F3 0%, var(--bx-ig-ph) 100%);
}
@media (prefers-reduced-motion: reduce) {
	html body .bx-ig__track { animation: none; }
}
@media (max-width: 1024px) {
	html body .bx-ig { --bx-ig-h: 320px; --bx-ig-py: 60px; }
	html body .bx-ig__head h2 { font-size: 36px; }
}
@media (max-width: 767px) {
	html body .bx-ig { --bx-ig-h: 260px; --bx-ig-py: 48px; }
	html body .bx-ig__head { margin-bottom: 24px; }
	html body .bx-ig__head h2 { font-size: 30px; }
}

/* ==================================================================
   Categorieën (.bx-cat) — ontwerp "Bioxcin Secties.dc (3).html", sectie "Shop op haarklacht"
   ================================================================== */
html body .bx-cat {
	--bx-cat-bg: #FFFFFF;
	--bx-cat-accent: #8B2332;
	--bx-cat-title: #6E1A28;
	--bx-cat-text: #5A3F46;
	--bx-cat-soft: #F5DFE2;
	--bx-cat-cta-bg: #F8F3F3;
	--bx-cat-ph: #EAD9DC;
	--bx-cat-cols: 3;
	--bx-cat-h: 396px;
	--bx-cat-gap: 22px;
	--bx-cat-maxw: 1260px;
	--bx-cat-radius: 28px;
	--bx-cat-shade: 1;
	--bx-cat-py: 96px;
	--bx-cat-px: 20px;
	position: relative;
	margin: 0;
	padding: var(--bx-cat-py) var(--bx-cat-px) calc(var(--bx-cat-py) + 14px);
	background: var(--bx-cat-bg);
	font-family: 'Outfit', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
	color: var(--bx-cat-text);
	line-height: 1.5;
	-webkit-font-smoothing: antialiased;
}
html body .bx-cat *,
html body .bx-cat *::before,
html body .bx-cat *::after { box-sizing: border-box; }
html body .bx-cat__in { max-width: var(--bx-cat-maxw); margin: 0 auto; }
html body .bx-cat__head {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 16px;
	margin: 0 0 56px;
	text-align: center;
}
html body .bx-cat__eyebrow {
	display: block;
	font-size: 12px;
	font-weight: 600;
	letter-spacing: .16em;
	text-transform: uppercase;
	color: var(--bx-cat-accent);
}
html body .bx-cat__title {
	margin: 0;
	font-family: inherit;
	font-size: 64px;
	font-weight: 700;
	line-height: 1.05;
	letter-spacing: -.02em;
	color: var(--bx-cat-title);
	text-transform: none;
	text-wrap: balance;
}
html body .bx-cat__title em { font-style: normal; color: var(--bx-cat-accent); }
html body .bx-cat__text {
	max-width: 58ch;
	margin: 0;
	font-size: 17px;
	line-height: 1.7;
	color: var(--bx-cat-text);
}
html body .bx-cat__grid {
	display: grid;
	grid-template-columns: repeat(var(--bx-cat-cols), minmax(0, 1fr));
	grid-auto-rows: var(--bx-cat-h);
	gap: var(--bx-cat-gap);
}
html body .bx-cat__tile,
html body .bx-cat__tile:visited {
	position: relative;
	display: block;
	overflow: hidden;
	margin: 0;
	border-radius: var(--bx-cat-radius);
	background: var(--bx-cat-ph);
	color: #fff;
	text-decoration: none;
}
html body .bx-cat__media { position: absolute; inset: 0; }
html body .bx-cat__media img {
	display: block;
	width: 100%;
	height: 100%;
	max-width: none;
	margin: 0;
	object-fit: cover;
	border-radius: 0;
	transition: transform .7s ease;
}
html body a.bx-cat__tile:hover .bx-cat__media img { transform: scale(1.04); }
html body .bx-cat__ph {
	position: absolute;
	inset: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 24px 24px 120px;
	font-size: 13px;
	letter-spacing: .04em;
	text-align: center;
	color: var(--bx-cat-title);
	background: linear-gradient(160deg, #F8F3F3 0%, var(--bx-cat-ph) 100%);
}
html body .bx-cat__shade {
	position: absolute;
	inset: 0;
	pointer-events: none;
	opacity: var(--bx-cat-shade);
	background: linear-gradient(180deg, rgba(110, 26, 40, 0) 30%, rgba(110, 26, 40, .55) 65%, rgba(74, 15, 27, .95) 100%);
}
html body .bx-cat__body {
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0;
	display: flex;
	flex-direction: column;
	gap: 8px;
	padding: 32px 36px;
}
html body .bx-cat__body h3 {
	margin: 0;
	font-family: inherit;
	font-size: 36px;
	font-weight: 700;
	line-height: 1.05;
	letter-spacing: -.015em;
	color: #fff;
	text-transform: none;
}
html body .bx-cat__body p {
	margin: 0;
	font-size: 15px;
	line-height: 1.55;
	color: var(--bx-cat-soft);
}
html body .bx-cat__cta {
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	gap: 24px;
	padding: 40px 40px 36px;
	border-radius: var(--bx-cat-radius);
	background: var(--bx-cat-cta-bg);
}
html body .bx-cat__cta-top { display: flex; flex-direction: column; gap: 14px; }
html body .bx-cat__cta h3 {
	margin: 0;
	font-family: inherit;
	font-size: 36px;
	font-weight: 700;
	line-height: 1.1;
	letter-spacing: -.015em;
	color: var(--bx-cat-title);
	text-transform: none;
	text-wrap: balance;
}
html body .bx-cat__btn,
html body .bx-cat__btn:visited {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	width: fit-content;
	margin: 0;
	padding: 16px 28px;
	border: 0;
	border-radius: 999px;
	background: var(--bx-cat-accent);
	color: #fff !important;
	font-family: inherit;
	font-size: 14px;
	font-weight: 600;
	line-height: 1.2;
	letter-spacing: normal;
	text-transform: none;
	white-space: nowrap;
	text-decoration: none;
	transition: background .2s ease;
}
html body .bx-cat__btn:hover,
html body .bx-cat__btn:focus-visible {
	background: var(--bx-cat-title);
	color: #fff !important;
	text-decoration: none;
}
@media (max-width: 1024px) {
	html body .bx-cat { --bx-cat-cols: 2; --bx-cat-h: 340px; --bx-cat-py: 72px; }
	html body .bx-cat__title { font-size: 46px; }
	html body .bx-cat__head { margin-bottom: 40px; }
	html body .bx-cat__body { padding: 26px 28px; }
	html body .bx-cat__body h3, html body .bx-cat__cta h3 { font-size: 30px; }
	html body .bx-cat__cta { padding: 32px 30px 28px; }
}
@media (max-width: 640px) {
	html body .bx-cat { --bx-cat-cols: 1; --bx-cat-h: 300px; --bx-cat-gap: 14px; --bx-cat-py: 56px; }
	html body .bx-cat__title { font-size: 34px; }
	html body .bx-cat__head { gap: 12px; margin-bottom: 32px; }
	html body .bx-cat__text { font-size: 15px; }
	html body .bx-cat__body { padding: 22px 24px; }
	html body .bx-cat__body h3, html body .bx-cat__cta h3 { font-size: 26px; }
	html body .bx-cat__cta { padding: 28px 26px; }
}