/* =============================================================================
   BilligKanel — main.css
   Aesthetic: "Nordic Spice Editorial"
   ─ Display: Fraunces (variable serif, opsz)
   ─ Body:    Manrope (variable sans)
   ─ Palette: warm cream + espresso, cinnamon accent, saffron details
   ============================================================================= */

/* ---------- Tokens ---------- */
:root {
	/* Surface & ink — matched to live billigkanel.dk (Avada) palette */
	--bk-cream-50:  #fffdfb;   /* page bg */
	--bk-cream-100: #fff8f3;   /* paper / soft surface */
	--bk-cream-200: #f9f7f0;   /* divider tint */
	--bk-stone-300: #e7ddd6;   /* hairline border */
	--bk-stone-400: #d8c9bd;   /* muted border accent */
	--bk-stone-500: #6a5448;   /* muted text */
	--bk-stone-700: #4a3528;   /* soft text */
	--bk-espresso:  #2c1810;   /* primary text */
	--bk-ink:       #2b1b12;   /* dark surface */

	/* Spice palette — live cinnamon browns */
	--bk-cinnamon-50:  #f8ede3;
	--bk-cinnamon-100: #f0dccb;
	--bk-cinnamon-200: #e4c3a6;
	--bk-cinnamon-500: #c1843f;
	--bk-cinnamon:     #b86f3a;   /* primary accent */
	--bk-cinnamon-700: #8d4f24;   /* hover / dark */
	--bk-cinnamon-900: #5e3417;
	--bk-saffron:      #c69a4f;   /* gold accent */
	--bk-rust:         #8e3a17;
	--bk-paprika:      #c14b1f;
	--bk-link-hover:   #65bc7b;   /* live green link hover */

	/* Status */
	--bk-success: #2f7d3a;
	--bk-success-soft: #e0f0e3;
	--bk-danger: #b32027;
	--bk-info:   #345fb4;

	/* Aliases — kept for legacy compatibility */
	--bk-color-bg: var(--bk-cream-50);
	--bk-color-surface: #ffffff;
	--bk-color-surface-2: var(--bk-cream-100);
	--bk-color-line: var(--bk-stone-300);
	--bk-color-text: var(--bk-espresso);
	--bk-color-text-soft: var(--bk-stone-700);
	--bk-color-muted: var(--bk-stone-500);
	--bk-color-accent: var(--bk-cinnamon);
	--bk-color-accent-hover: var(--bk-cinnamon-700);
	--bk-color-accent-soft: var(--bk-cinnamon-100);
	--bk-color-success: var(--bk-success);
	--bk-color-success-soft: var(--bk-success-soft);
	--bk-color-danger: var(--bk-danger);
	--bk-color-info: var(--bk-info);

	/* Typography — live pairing: Playfair Display (headings) + PT Sans (body) */
	--bk-font-display: 'Playfair Display', Georgia, 'Times New Roman', serif;
	--bk-font-body: 'PT Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', system-ui, sans-serif;
	--bk-font-mono: ui-monospace, 'SF Mono', 'Cascadia Mono', Menlo, monospace;
	--bk-font-sans: var(--bk-font-body);

	/* Type scale (mobile-first; bumped on lg) */
	--bk-fs-300: 0.8125rem;
	--bk-fs-400: 1rem;
	--bk-fs-500: 1.125rem;
	--bk-fs-600: 1.375rem;
	--bk-fs-700: 1.75rem;
	--bk-fs-800: 2.375rem;
	--bk-fs-900: 3rem;
	--bk-fs-1000: 3.75rem;

	/* Spacing */
	--bk-space-1: 0.25rem;
	--bk-space-2: 0.5rem;
	--bk-space-3: 0.75rem;
	--bk-space-4: 1rem;
	--bk-space-5: 1.25rem;
	--bk-space-6: 1.5rem;
	--bk-space-8: 2rem;
	--bk-space-10: 2.5rem;
	--bk-space-12: 3rem;
	--bk-space-16: 4rem;
	--bk-space-20: 5rem;
	--bk-space-24: 6rem;

	/* Layout */
	--bk-container: 1240px;
	--bk-container-narrow: 760px;
	--bk-radius-sm: 6px;
	--bk-radius: 12px;
	--bk-radius-lg: 20px;
	--bk-radius-pill: 999px;

	--bk-shadow-xs: 0 1px 2px rgba(26, 20, 16, 0.05);
	--bk-shadow-sm: 0 2px 6px rgba(26, 20, 16, 0.06), 0 1px 2px rgba(26, 20, 16, 0.04);
	--bk-shadow:    0 14px 32px -12px rgba(26, 20, 16, 0.18), 0 4px 12px rgba(26, 20, 16, 0.05);
	--bk-shadow-lg: 0 30px 60px -20px rgba(26, 20, 16, 0.24), 0 10px 20px rgba(26, 20, 16, 0.06);

	--bk-header-height: 76px;
	--bk-header-height-mobile: 60px;
	--bk-trust-bar-height: 36px;
	--bk-sticky-cta-height: 64px;

	/* Variable-font axes baked in for nice, characterful display text */
	--bk-display-opsz: 96;
	--bk-display-soft: 30;
}

/* =============================================================================
   Breakpoint system — kanonisk:
   --bk-bp-sm: 480px   | store mobiler / phablet
   --bk-bp-md: 768px   | tablet portrait + grænse for mobile-nav
   --bk-bp-lg: 1024px  | tablet landscape / small desktop
   --bk-bp-xl: 1280px  | large desktop
   Brug kun disse i ny CSS. Eksisterende ad hoc breakpoints konsolideres
   gradvist (se /Users/jannicklangkjaer/.claude/plans/du-skal-gennemg-...).
   ============================================================================= */

@media (min-width: 768px) {
	:root {
		--bk-fs-800: 2.75rem;
		--bk-fs-900: 3.5rem;
		--bk-fs-1000: 4.5rem;
	}
}
@media (min-width: 1200px) {
	:root {
		--bk-fs-900: 4rem;
		--bk-fs-1000: 5.25rem;
	}
}

/* ---------- Reset ---------- */
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; -moz-text-size-adjust: 100%; text-size-adjust: 100%; }
html, body { margin: 0; }
body {
	font-family: var(--bk-font-body);
	font-size: var(--bk-fs-400);
	line-height: 1.6;
	color: var(--bk-color-text);
	background: var(--bk-cream-50);
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	text-rendering: optimizeLegibility;
	background-image:
		radial-gradient(1200px 620px at 100% -10%, rgba(198, 154, 79, 0.10), transparent 62%),
		radial-gradient(960px 520px at -10% 108%, rgba(184, 111, 58, 0.08), transparent 60%),
		linear-gradient(180deg, #fffdfb 0%, #fdf6ee 55%, #fbf1e6 100%);
	background-attachment: fixed, fixed, fixed;
}
img, picture, svg, video { display: block; max-width: 100%; height: auto; }
button { font: inherit; color: inherit; }
input, select, textarea { font: inherit; color: inherit; }
a { color: var(--bk-cinnamon); text-decoration: none; transition: color .12s ease; }
a:hover { color: var(--bk-link-hover); text-decoration: underline; text-underline-offset: 3px; }
hr { border: 0; border-top: 1px solid var(--bk-stone-300); margin: var(--bk-space-8) 0; }

h1, h2, h3, h4, h5 {
	font-family: var(--bk-font-display);
	line-height: 1.12;
	margin: 0 0 var(--bk-space-4);
	font-weight: 700;
	letter-spacing: -0.01em;
	color: var(--bk-espresso);
}
/* Fluid headings — clamp(min, fluid-mid, max). Mobile-first så h1 ikke
   overflyder 320-px-skærme; pages/components må stadig override locally. */
h1 { font-size: clamp(2.25rem, 4vw + 1rem, 4.25rem); font-weight: 700; letter-spacing: -0.015em; }
h2 { font-size: clamp(1.75rem, 3vw + 1rem, 3rem); font-weight: 700; letter-spacing: -0.01em; }
h3 { font-size: clamp(1.4rem, 2vw + 0.8rem, 2rem); font-weight: 700; letter-spacing: -0.005em; }
h4 { font-size: clamp(1.2rem, 1.4vw + 0.75rem, 1.5rem); font-weight: 700; }
h5 { font-size: var(--bk-fs-500); font-weight: 600; letter-spacing: -0.01em; }
p { margin: 0 0 var(--bk-space-4); }
strong { font-weight: 700; color: var(--bk-espresso); }
small { font-size: 0.86em; }

ul, ol { margin: 0 0 var(--bk-space-4); padding-left: 1.4rem; }
ul li::marker { color: var(--bk-cinnamon); }

/* Display class for hero/marquee headlines */
.bk-display {
	font-family: var(--bk-font-display);
	font-weight: 400;
	font-style: italic;
	font-variation-settings: "opsz" 144, "SOFT" 50, "WONK" 1;
	letter-spacing: -0.04em;
	line-height: 0.95;
}

/* Visually hidden */
.screen-reader-text {
	position: absolute !important;
	width: 1px; height: 1px;
	padding: 0; margin: -1px;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	white-space: nowrap;
	border: 0;
}

/* Skip link */
.skip-link {
	position: absolute; left: -9999px; top: 0;
	background: var(--bk-cinnamon); color: #fff;
	padding: var(--bk-space-2) var(--bk-space-4);
	z-index: 9999;
	border-radius: 0 0 var(--bk-radius-sm) 0;
	font-weight: 600;
}
.skip-link:focus { left: 0; top: 0; }

/* Selection */
::selection { background: var(--bk-cinnamon); color: #fff; }

/* ---------- Layout primitives ---------- */
.bk-container {
	width: 100%;
	max-width: var(--bk-container);
	margin-inline: auto;
	padding-inline: var(--bk-space-4);
}
@media (min-width: 768px) { .bk-container { padding-inline: var(--bk-space-6); } }
@media (min-width: 1200px) { .bk-container { padding-inline: var(--bk-space-8); } }
.bk-container--narrow { max-width: var(--bk-container-narrow); }
.bk-container--wide { max-width: 1480px; }

.bk-section { padding-block: var(--bk-space-16); position: relative; }
@media (min-width: 1024px) { .bk-section { padding-block: var(--bk-space-24); } }
.bk-section--tight { padding-block: var(--bk-space-10); }
.bk-section--bleed { padding-inline: 0; }

.bk-stack > * + * { margin-top: var(--bk-space-4); }
.bk-stack-lg > * + * { margin-top: var(--bk-space-6); }
.bk-stack-xl > * + * { margin-top: var(--bk-space-8); }

/* Eyebrow & section number markers */
.bk-eyebrow {
	display: inline-flex;
	align-items: center;
	gap: 0.5rem;
	font-size: 0.78rem;
	font-weight: 600;
	letter-spacing: 0.18em;
	text-transform: uppercase;
	color: var(--bk-cinnamon);
	margin-bottom: var(--bk-space-3);
	font-feature-settings: "ss02";
}
.bk-eyebrow::before {
	content: "";
	display: inline-block;
	width: 1.4rem;
	height: 1px;
	background: currentColor;
	opacity: 0.6;
}
.bk-eyebrow--center { justify-content: center; }
.bk-eyebrow--center::before { display: none; }
.bk-eyebrow--center::after,
.bk-eyebrow--center::before {
	content: "";
	display: inline-block;
	width: 1.4rem;
	height: 1px;
	background: currentColor;
	opacity: 0.6;
}
.bk-eyebrow--center::before { display: inline-block; }

.bk-section-num {
	display: inline-block;
	font-family: var(--bk-font-display);
	font-style: italic;
	font-size: 0.86rem;
	color: var(--bk-stone-500);
	letter-spacing: 0.04em;
	margin-bottom: var(--bk-space-2);
	font-variation-settings: "opsz" 14;
}

/* ---------- Buttons ---------- */
.bk-btn,
.button,
button.button,
.woocommerce a.button,
.woocommerce button.button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 0.55rem;
	padding: 0.95rem 1.6rem;
	border-radius: var(--bk-radius);
	background: var(--bk-espresso);
	color: #fff !important;
	border: 1px solid var(--bk-espresso);
	font-family: var(--bk-font-body);
	font-weight: 600;
	font-size: var(--bk-fs-400);
	line-height: 1.2;
	letter-spacing: -0.005em;
	cursor: pointer;
	text-decoration: none;
	transition: background .18s ease, border-color .18s ease, transform .08s ease, box-shadow .18s ease;
	min-height: 50px;
	box-shadow: 0 1px 2px rgba(0,0,0,.05);
	-webkit-tap-highlight-color: transparent;
}
.bk-btn:hover,
.button:hover,
.woocommerce a.button:hover,
.woocommerce button.button:hover {
	background: var(--bk-ink);
	border-color: var(--bk-ink);
	color: #fff !important;
	text-decoration: none;
	box-shadow: 0 8px 24px -8px rgba(26, 20, 16, 0.4);
	transform: translateY(-1px);
}
.bk-btn:active,
.button:active { transform: translateY(0); box-shadow: var(--bk-shadow-xs); }
.bk-btn:focus-visible,
.button:focus-visible {
	outline: 3px solid var(--bk-cinnamon);
	outline-offset: 3px;
}

/* Primary cinnamon — used for hero CTAs and add-to-cart */
.bk-btn--primary,
.bk-btn--accent,
.woocommerce a.button.alt,
.woocommerce button.button.alt,
.single_add_to_cart_button,
.checkout-button,
#place_order {
	background: var(--bk-cinnamon);
	border-color: var(--bk-cinnamon);
	color: #fff !important;
}
.bk-btn--primary:hover,
.woocommerce a.button.alt:hover,
.woocommerce button.button.alt:hover,
.single_add_to_cart_button:hover,
.checkout-button:hover,
#place_order:hover {
	background: var(--bk-cinnamon-700);
	border-color: var(--bk-cinnamon-700);
}

.bk-btn--secondary {
	background: transparent;
	color: var(--bk-espresso) !important;
	border-color: var(--bk-stone-400);
}
.bk-btn--secondary:hover {
	background: var(--bk-cream-100);
	border-color: var(--bk-espresso);
	color: var(--bk-espresso) !important;
}

.bk-btn--ghost {
	background: transparent;
	color: var(--bk-espresso) !important;
	border-color: transparent;
	box-shadow: inset 0 0 0 1px var(--bk-stone-300);
}
.bk-btn--ghost:hover {
	background: var(--bk-cream-100);
	color: var(--bk-espresso) !important;
	box-shadow: inset 0 0 0 1px var(--bk-espresso);
}

.bk-btn--full { width: 100%; }
.bk-btn--lg { padding: 1.1rem 1.9rem; font-size: var(--bk-fs-500); min-height: 56px; border-radius: var(--bk-radius); }
.bk-btn--sm { padding: 0.7rem 1.1rem; min-height: 44px; font-size: 0.86rem; border-radius: var(--bk-radius-sm); }
.bk-btn--pill { border-radius: var(--bk-radius-pill); }

/* Icon button */
.bk-btn--icon {
	width: 44px;
	height: 44px;
	padding: 0;
	min-height: 44px;
	border-radius: var(--bk-radius-sm);
}

/* ---------- Forms ---------- */
input[type="text"], input[type="email"], input[type="tel"], input[type="number"],
input[type="search"], input[type="password"], input[type="url"], select, textarea {
	width: 100%;
	padding: 0.8rem 1rem;
	border: 1px solid var(--bk-stone-300);
	border-radius: var(--bk-radius-sm);
	background: #fff;
	min-height: 48px;
	font-family: inherit;
	transition: border-color .15s ease, box-shadow .15s ease;
}
select { padding-right: 2.4rem; appearance: none; background-image: linear-gradient(45deg, transparent 50%, var(--bk-stone-700) 50%), linear-gradient(135deg, var(--bk-stone-700) 50%, transparent 50%); background-position: calc(100% - 18px) 50%, calc(100% - 13px) 50%; background-size: 5px 5px, 5px 5px; background-repeat: no-repeat; }
input:focus, select:focus, textarea:focus {
	outline: none;
	border-color: var(--bk-cinnamon);
	box-shadow: 0 0 0 3px var(--bk-cinnamon-100);
}
label { font-weight: 600; color: var(--bk-espresso); }

/* ---------- Trust bar (kontinuerlig højre-mod-venstre marquee) ---------- */
.bk-trust-bar {
	background: var(--bk-ink);
	color: var(--bk-cream-50);
	font-size: 0.78rem;
	letter-spacing: 0.04em;
	min-height: var(--bk-trust-bar-height);
	overflow: hidden;
	/* fade ind/ud på kanterne så marqueen aldrig "afbryder" hårdt */
	-webkit-mask-image: linear-gradient(90deg, transparent 0, #000 56px, #000 calc(100% - 56px), transparent 100%);
	        mask-image: linear-gradient(90deg, transparent 0, #000 56px, #000 calc(100% - 56px), transparent 100%);
}
.bk-trust-bar__viewport {
	overflow: hidden;
	width: 100%;
	display: flex;
	align-items: center;
	min-height: var(--bk-trust-bar-height);
}
.bk-trust-bar__track {
	display: flex;
	align-items: center;
	width: max-content;
	flex: 0 0 auto;
	animation: bk-trust-marquee 48s linear infinite;
	will-change: transform;
}
.bk-trust-bar:hover .bk-trust-bar__track,
.bk-trust-bar:focus-within .bk-trust-bar__track {
	animation-play-state: paused;
}
.bk-trust-bar__group {
	display: inline-flex;
	align-items: center;
	gap: var(--bk-space-5);
	padding-right: var(--bk-space-5);
	flex: 0 0 auto;
	white-space: nowrap;
}
.bk-trust-bar__item {
	display: inline-flex;
	gap: 0.45rem;
	align-items: center;
	color: rgba(252, 249, 244, 0.92);
	white-space: nowrap;
}
.bk-trust-bar__item svg { color: var(--bk-saffron); width: 14px; height: 14px; flex-shrink: 0; }
.bk-trust-bar__sep {
	color: rgba(252, 249, 244, 0.28);
	font-size: 0.92rem;
	line-height: 1;
}
@keyframes bk-trust-marquee {
	from { transform: translate3d(0, 0, 0); }
	to   { transform: translate3d(-50%, 0, 0); }
}
@media (prefers-reduced-motion: reduce) {
	.bk-trust-bar__track { animation: none; }
}

/* ---------- Header ---------- */
.bk-header {
	background: rgba(252, 249, 244, 0.85);
	backdrop-filter: saturate(180%) blur(10px);
	-webkit-backdrop-filter: saturate(180%) blur(10px);
	border-bottom: 1px solid rgba(214, 196, 173, 0.5);
	position: sticky;
	top: 0;
	z-index: 50;
}
.bk-header__inner {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: var(--bk-space-3);
	min-height: var(--bk-header-height-mobile);
	padding-block: var(--bk-space-2);
}
@media (min-width: 768px) {
	.bk-header__inner {
		gap: var(--bk-space-4);
		min-height: var(--bk-header-height);
		padding-block: var(--bk-space-3);
	}
}
.bk-logo a {
	display: inline-flex;
	align-items: center;
	gap: 0.5rem;
	color: var(--bk-espresso);
	text-decoration: none;
	font-family: var(--bk-font-display);
	font-weight: 500;
	font-size: 1.2rem;
	letter-spacing: -0.025em;
	font-variation-settings: "opsz" 24, "SOFT" 30;
}
@media (min-width: 768px) {
	.bk-logo a { font-size: 1.4rem; }
}
.bk-logo a:hover { text-decoration: none; color: var(--bk-cinnamon); }
.bk-logo img { max-height: 32px; width: auto; }
@media (min-width: 768px) {
	.bk-logo img { max-height: 40px; }
}
.bk-logo span:last-child { color: var(--bk-cinnamon); }

/* Main nav (desktop, inline) */
.bk-nav {
	display: none;
}
.bk-nav__list {
	display: flex;
	list-style: none;
	margin: 0;
	padding: 0;
	gap: var(--bk-space-1);
}
.bk-nav__list a {
	color: var(--bk-espresso);
	font-weight: 500;
	font-size: 0.96rem;
	padding: 0.55rem 0.9rem;
	display: inline-block;
	border-radius: var(--bk-radius-sm);
	position: relative;
}
/* Desktop nav: an animated underline indicator that grows from the centre on
   hover / for the active item — a more premium feel than the old flat pill.
   Scoped to the inline desktop nav so the off-canvas mobile menu is untouched. */
.bk-nav:not(.bk-nav--mobile) .bk-nav__list a::after {
	content: "";
	position: absolute;
	left: 0.85rem;
	right: 0.85rem;
	bottom: 0.3rem;
	height: 2px;
	border-radius: 2px;
	background: var(--bk-cinnamon);
	transform: scaleX(0);
	transform-origin: center;
	transition: transform .22s cubic-bezier(0.16, 1, 0.3, 1);
}
.bk-nav:not(.bk-nav--mobile) .bk-nav__list a:hover,
.bk-nav:not(.bk-nav--mobile) .bk-nav__list .current-menu-item > a,
.bk-nav:not(.bk-nav--mobile) .bk-nav__list .current-menu-parent > a {
	color: var(--bk-cinnamon);
	background: transparent;
	text-decoration: none;
}
.bk-nav:not(.bk-nav--mobile) .bk-nav__list a:hover::after,
.bk-nav:not(.bk-nav--mobile) .bk-nav__list a:focus-visible::after,
.bk-nav:not(.bk-nav--mobile) .bk-nav__list .current-menu-item > a::after,
.bk-nav:not(.bk-nav--mobile) .bk-nav__list .current-menu-parent > a::after {
	transform: scaleX(1);
}
@media (prefers-reduced-motion: reduce) {
	.bk-nav:not(.bk-nav--mobile) .bk-nav__list a::after { transition: none; }
}
@media (min-width: 1024px) {
	.bk-nav:not(.bk-nav--mobile) { display: flex; }
}

/* Hamburger toggle — vises < lg */
.bk-nav-toggle {
	display: inline-flex;
	background: transparent;
	border: 1px solid var(--bk-stone-300);
	border-radius: var(--bk-radius-sm);
	padding: 0.55rem 0.65rem;
	cursor: pointer;
	min-height: 44px;
	min-width: 44px;
	align-items: center;
	justify-content: center;
	transition: border-color .12s, background .12s;
	-webkit-tap-highlight-color: transparent;
}
.bk-nav-toggle:hover { border-color: var(--bk-espresso); background: var(--bk-cream-100); }
.bk-nav-toggle:focus-visible {
	outline: 3px solid var(--bk-cinnamon);
	outline-offset: 2px;
}
@media (min-width: 1024px) { .bk-nav-toggle { display: none; } }

/* Off-canvas mobile/tablet nav drawer (slider ind fra højre, matcher cart-drawer) */
.bk-nav--mobile {
	position: fixed;
	inset: 0;
	z-index: 90;
	pointer-events: none;
	display: block;
	background: transparent;
	border: 0;
	padding: 0;
	box-shadow: none;
	/* Hide off-screen panel content while closed — but keep it in the DOM
	   for screen-reader / focus management. */
}
.bk-nav--mobile[aria-hidden="false"] { pointer-events: auto; }
.bk-nav--mobile::before {
	content: "";
	position: absolute;
	inset: 0;
	background: rgba(13, 9, 7, 0.45);
	backdrop-filter: blur(2px);
	-webkit-backdrop-filter: blur(2px);
	opacity: 0;
	transition: opacity .25s ease;
	pointer-events: none;
	z-index: 0;
}
.bk-nav--mobile.is-open::before {
	opacity: 1;
	pointer-events: auto;
}
.bk-nav--mobile__panel {
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	width: min(86vw, 360px);
	background: var(--bk-cream-50);
	box-shadow: var(--bk-shadow-lg);
	transform: translateX(100%);
	transition: transform .3s cubic-bezier(0.16, 1, 0.3, 1);
	display: flex;
	flex-direction: column;
	outline: none;
	z-index: 1;
}
.bk-nav--mobile.is-open .bk-nav--mobile__panel { transform: translateX(0); }
.bk-nav--mobile__head {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: var(--bk-space-4) var(--bk-space-5);
	border-bottom: 1px solid var(--bk-stone-300);
	background: #fff;
	flex-shrink: 0;
}
.bk-nav--mobile__title {
	margin: 0;
	font-family: var(--bk-font-display);
	font-size: 1.15rem;
	font-weight: 500;
	letter-spacing: -0.015em;
	color: var(--bk-espresso);
	font-variation-settings: "opsz" 60, "SOFT" 30;
}
.bk-nav--mobile__close {
	background: transparent;
	border: 0;
	cursor: pointer;
	padding: 0.5rem;
	color: var(--bk-stone-700);
	border-radius: var(--bk-radius-sm);
	min-width: 44px;
	min-height: 44px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	font-size: 1.5rem;
	line-height: 1;
	transition: color .12s, background .12s;
}
.bk-nav--mobile__close:hover { background: var(--bk-cream-100); color: var(--bk-cinnamon); }
.bk-nav--mobile .bk-nav__list {
	display: flex;
	flex-direction: column;
	gap: 0;
	flex: 1 1 auto;
	overflow-y: auto;
	padding: var(--bk-space-3);
	margin: 0;
	list-style: none;
	width: 100%;
	min-height: 0;
}
.bk-nav--mobile .bk-nav__list li {
	display: block;
	list-style: none;
	width: 100%;
}
.bk-nav--mobile .bk-nav__list li::marker { content: ""; }
.bk-nav--mobile .bk-nav__list a {
	display: flex;
	align-items: center;
	min-height: 52px;
	padding: 0.85rem var(--bk-space-3);
	border-radius: var(--bk-radius-sm);
	font-family: var(--bk-font-display);
	font-size: 1.1rem;
	font-weight: 500;
	letter-spacing: -0.01em;
	color: var(--bk-espresso);
	border-bottom: 1px solid rgba(31, 26, 20, 0.06);
	width: 100%;
}
.bk-nav--mobile .bk-nav__list li:last-child a { border-bottom: 0; }
.bk-nav--mobile .bk-nav__list a:hover {
	background: var(--bk-cream-100);
	color: var(--bk-cinnamon);
	text-decoration: none;
}
@media (min-width: 1024px) {
	.bk-nav--mobile { display: none; pointer-events: none; }
}
@media (prefers-reduced-motion: reduce) {
	.bk-nav--mobile::before,
	.bk-nav--mobile__panel { transition: none; }
}

/* Cart trigger */
.bk-cart-trigger { display: inline-block; }
.bk-cart-trigger__btn {
	position: relative;
	background: transparent;
	border: 1px solid var(--bk-stone-300);
	border-radius: var(--bk-radius-sm);
	padding: 0.55rem 0.65rem;
	min-height: 44px;
	min-width: 44px;
	cursor: pointer;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	transition: border-color .12s, background .12s, color .12s;
}
.bk-cart-trigger__btn:hover { border-color: var(--bk-espresso); background: var(--bk-cream-100); color: var(--bk-cinnamon); }
.bk-cart-trigger__count {
	position: absolute;
	top: -7px; right: -7px;
	background: var(--bk-cinnamon);
	color: #fff;
	font-size: 0.7rem;
	font-weight: 700;
	min-width: 20px;
	height: 20px;
	border-radius: 999px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	padding: 0 5px;
	box-shadow: 0 0 0 2px var(--bk-cream-50);
	font-variant-numeric: tabular-nums;
}
.bk-cart-trigger__btn svg { width: 22px; height: 22px; }
.bk-cart-trigger.is-bumping .bk-cart-trigger__btn,
.bk-cart-trigger__btn.is-bumping {
	animation: bk-cart-bump .55s cubic-bezier(0.16, 1, 0.3, 1);
}
@keyframes bk-cart-bump {
	0%   { transform: scale(1); }
	35%  { transform: scale(1.18) rotate(-4deg); }
	60%  { transform: scale(0.96) rotate(2deg); }
	100% { transform: scale(1); }
}
@media (prefers-reduced-motion: reduce) {
	.bk-cart-trigger.is-bumping .bk-cart-trigger__btn,
	.bk-cart-trigger__btn.is-bumping { animation: none; }
}

/* ---------- Footer ---------- */
.bk-footer {
	background: var(--bk-ink);
	color: rgba(252, 249, 244, 0.7);
	padding-top: var(--bk-space-16);
	margin-top: 0;
	font-size: 0.92rem;
	position: relative;
	overflow: hidden;
}
.bk-footer::before {
	content: "";
	position: absolute;
	inset: 0;
	background:
		radial-gradient(800px 400px at 0% 0%, rgba(196, 154, 79, 0.08), transparent 60%),
		radial-gradient(800px 400px at 100% 100%, rgba(164, 71, 33, 0.08), transparent 60%);
	pointer-events: none;
}
.bk-footer > .bk-container { position: relative; }
.bk-footer__brand {
	margin-bottom: var(--bk-space-12);
	padding-bottom: var(--bk-space-10);
	border-bottom: 1px solid rgba(252, 249, 244, 0.08);
	display: grid;
	grid-template-columns: 1fr;
	gap: var(--bk-space-8);
}
@media (min-width: 800px) {
	.bk-footer__brand {
		grid-template-columns: minmax(0, 1.5fr) minmax(0, 1fr);
		align-items: center;
		gap: var(--bk-space-12);
	}
}
/* Left column: claim → trustpilot → CTAs, stacked. Previously these were loose
   grid children of .bk-footer__brand and scattered across the two tracks. */
.bk-footer__brand-main {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: var(--bk-space-5);
}
.bk-footer__logo {
	display: inline-flex;
	line-height: 0;
}
.bk-footer__logo-img {
	height: 40px;
	width: auto;
}
.bk-footer__brand h3 {
	color: #fff;
	font-size: var(--bk-fs-800);
	margin: 0;
	max-width: 18ch;
}
.bk-footer__brand h3 em {
	font-style: italic;
	color: var(--bk-saffron);
	font-variation-settings: "opsz" 144, "SOFT" 70;
}
.bk-footer__brand-claim {
	color: inherit;
	text-decoration: none;
}
/* No hover treatment on the brand claim — it stays static (only a keyboard
   focus ring remains, for accessibility). */
.bk-footer__brand-claim:hover {
	color: inherit;
	text-decoration: none;
}
.bk-footer__brand-claim:focus-visible {
	outline: 3px solid var(--bk-saffron);
	outline-offset: 3px;
	border-radius: 2px;
}
.bk-footer__brand-cta {
	display: flex;
	gap: var(--bk-space-3);
	flex-wrap: wrap;
}

.bk-footer__grid {
	display: grid;
	grid-template-columns: 1fr;
	gap: var(--bk-space-8);
	padding-bottom: var(--bk-space-12);
}
@media (min-width: 600px) { .bk-footer__grid { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 1024px) { .bk-footer__grid { grid-template-columns: repeat(4, 1fr); column-gap: var(--bk-space-10); } }
.bk-footer__col h4 {
	color: #fff;
	font-family: var(--bk-font-body);
	font-size: 0.78rem;
	font-weight: 700;
	margin-bottom: var(--bk-space-4);
	text-transform: uppercase;
	letter-spacing: 0.18em;
	color: var(--bk-saffron);
}
.bk-footer__col ul {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: 0.55rem;
}
.bk-footer__col ul li::marker { content: ""; }
.bk-footer__col a {
	color: rgba(252, 249, 244, 0.78);
	text-decoration: none;
	transition: color .12s;
}
.bk-footer__col a:hover { color: #fff; text-decoration: none; }

.bk-payments {
	display: flex;
	flex-wrap: wrap;
	gap: 0.6rem;
	margin-bottom: var(--bk-space-4);
}
.bk-payments img,
.bk-payments svg {
	height: 24px;
	width: auto;
	background: #fff;
	border-radius: 4px;
	padding: 4px 6px;
}

.bk-footer__bottom {
	border-top: 1px solid rgba(252, 249, 244, 0.08);
	padding: var(--bk-space-5) 0;
	display: flex;
	flex-wrap: wrap;
	gap: var(--bk-space-3) var(--bk-space-6);
	justify-content: space-between;
	align-items: center;
	font-size: 0.8rem;
	color: rgba(252, 249, 244, 0.5);
}
.bk-footer__legal {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 0 var(--bk-space-5);
	list-style: none;
	margin: 0;
	padding: 0;
}
.bk-footer__legal ul { display: flex; flex-wrap: wrap; align-items: center; gap: 0 var(--bk-space-5); list-style: none; margin: 0; padding: 0; }
.bk-footer__legal li { list-style: none; display: inline-flex; align-items: center; }
.bk-footer__legal li::marker { content: ""; }
.bk-footer__legal a {
	color: rgba(252, 249, 244, 0.7);
	font-size: 0.82rem;
	letter-spacing: 0.01em;
	padding: 0.25rem 0;
	position: relative;
}
.bk-footer__legal a:hover { color: #fff; text-decoration: none; }
.bk-footer__legal > a:not(:last-child)::after,
.bk-footer__legal li:not(:last-child) a::after {
	content: "·";
	margin-left: var(--bk-space-5);
	color: rgba(252, 249, 244, 0.25);
	pointer-events: none;
}

/* ---------- Notices ----------
   The default WooCommerce stylesheet places an icon font glyph as a ::before
   pseudo-element with absolute positioning. Without proper text-indent the icon
   sits BEHIND the text. Override with a flex layout so the icon sits beside
   the message and never overlaps. */
.bk-notice,
.woocommerce-message,
.woocommerce-info,
.woocommerce-error {
	position: relative;
	display: flex;
	align-items: flex-start;
	gap: 0.7rem;
	border: 1px solid var(--bk-stone-300);
	background: #fff;
	border-radius: var(--bk-radius);
	padding: var(--bk-space-4) var(--bk-space-5);
	margin: 0 0 var(--bk-space-4);
	list-style: none;
	box-shadow: var(--bk-shadow-xs);
	font-size: 0.96rem;
	color: var(--bk-espresso);
	line-height: 1.5;
}
.woocommerce-message { border-color: var(--bk-success); background: var(--bk-success-soft); color: #1f4d28; }
.woocommerce-error   { border-color: var(--bk-danger);  background: #fdecec; color: #6b1217; }
.woocommerce-info    { border-color: var(--bk-info);    background: #ecf2fb; color: #1d3970; }

/* Replace the WC icon-font glyph with a native, in-flow chip. */
.bk-notice::before,
.woocommerce-message::before,
.woocommerce-info::before,
.woocommerce-error::before {
	content: "" !important;
	flex-shrink: 0;
	width: 22px;
	height: 22px;
	margin-top: 2px;
	border-radius: 50%;
	font-family: inherit !important;
	background: var(--bk-stone-500);
	color: #fff !important;
	display: inline-flex !important;
	align-items: center;
	justify-content: center;
	font-size: 0.78rem;
	font-weight: 700;
	position: static !important;
	left: auto !important;
	top: auto !important;
}
.woocommerce-message::before { content: "✓" !important; background: var(--bk-success); }
.woocommerce-error::before   { content: "!" !important; background: var(--bk-danger); }
.woocommerce-info::before    { content: "i" !important; background: var(--bk-info); font-style: italic; }

.woocommerce-message a,
.woocommerce-info a,
.woocommerce-error a {
	color: inherit;
	text-decoration: underline;
	font-weight: 600;
}
/* WC's "View cart" button inside a success notice */
.woocommerce-message .button {
	margin-left: auto;
	padding: 0.55rem 1.1rem !important;
	min-height: 38px !important;
	font-size: 0.86rem !important;
	border-radius: 8px !important;
}

/* ---------- Trust bullets variant ---------- */
.bk-trust-bullets {
	display: flex;
	flex-wrap: wrap;
	gap: var(--bk-space-3) var(--bk-space-5);
	list-style: none;
	margin: 0;
	padding: 0;
	color: var(--bk-stone-700);
	font-size: 0.92rem;
}
.bk-trust-bullets li {
	display: inline-flex;
	gap: 0.45rem;
	align-items: center;
}
.bk-trust-bullets svg { width: 18px; height: 18px; color: var(--bk-cinnamon); flex-shrink: 0; }
.bk-trust-bullets--inline {
	display: flex;
	flex-wrap: wrap;
	gap: var(--bk-space-3) var(--bk-space-5);
}
.bk-trust-bullets--stack {
	flex-direction: column;
	gap: 0.55rem;
}

/* ---------- Cards ---------- */
.bk-card {
	background: #fff;
	border: 1px solid var(--bk-stone-300);
	border-radius: var(--bk-radius);
	padding: var(--bk-space-5);
	box-shadow: var(--bk-shadow-xs);
	transition: border-color .15s, box-shadow .2s, transform .1s;
}
.bk-card--hover:hover {
	border-color: var(--bk-stone-400);
	box-shadow: var(--bk-shadow);
	transform: translateY(-2px);
}
.bk-card--feature {
	background: var(--bk-cream-100);
	border-color: var(--bk-cream-200);
}

/* ---------- Breadcrumbs ---------- */
.woocommerce-breadcrumb,
.bk-breadcrumbs {
	font-size: 0.82rem;
	color: var(--bk-stone-500);
	margin: var(--bk-space-4) 0;
	letter-spacing: 0.02em;
}
.woocommerce-breadcrumb a,
.bk-breadcrumbs a {
	color: var(--bk-stone-700);
	text-decoration: none;
}
.woocommerce-breadcrumb a:hover,
.bk-breadcrumbs a:hover { color: var(--bk-cinnamon); text-decoration: underline; }

/* ---------- Search ---------- */
.bk-search-form {
	display: flex;
	gap: var(--bk-space-2);
}
.bk-search-form input { flex: 1; }

/* ---------- Cookie banner ---------- */
.bk-cookie {
	position: fixed;
	bottom: var(--bk-space-4); left: var(--bk-space-4); right: var(--bk-space-4);
	background: var(--bk-ink);
	color: var(--bk-cream-50);
	padding: var(--bk-space-4) var(--bk-space-5);
	z-index: 60;
	transform: translateY(120%);
	transition: transform .25s cubic-bezier(0.16, 1, 0.3, 1);
	border-radius: var(--bk-radius);
	box-shadow: var(--bk-shadow-lg);
	max-width: 720px;
	margin-inline: auto;
}
.bk-cookie.is-visible { transform: translateY(0); }
.bk-cookie__inner {
	display: flex;
	flex-wrap: wrap;
	gap: var(--bk-space-4);
	align-items: center;
	justify-content: space-between;
}
.bk-cookie__text { font-size: 0.86rem; max-width: 540px; line-height: 1.5; margin: 0; }
.bk-cookie__link { color: var(--bk-cream-50); text-decoration: underline; text-underline-offset: 2px; }
.bk-cookie__link:hover { color: #fff; }
.bk-cookie__actions { display: flex; gap: var(--bk-space-2); }
.bk-cookie .bk-btn--ghost { color: var(--bk-cream-50) !important; box-shadow: inset 0 0 0 1px rgba(252, 249, 244, 0.3); }
.bk-cookie .bk-btn--ghost:hover { background: rgba(252, 249, 244, 0.06); box-shadow: inset 0 0 0 1px var(--bk-cream-50); }
.bk-cookie .bk-btn { background: var(--bk-cinnamon); border-color: var(--bk-cinnamon); }
.bk-cookie .bk-btn:hover { background: var(--bk-cinnamon-700); border-color: var(--bk-cinnamon-700); }

/* ---------- Decorative dividers ---------- */
.bk-divider {
	display: flex;
	align-items: center;
	gap: var(--bk-space-3);
	color: var(--bk-stone-500);
	font-size: 0.78rem;
	letter-spacing: 0.18em;
	text-transform: uppercase;
}
.bk-divider::before, .bk-divider::after {
	content: "";
	flex: 1;
	height: 1px;
	background: var(--bk-stone-300);
}

/* ---------- Animations ---------- */
@keyframes bk-rise {
	from { opacity: 0; transform: translateY(14px); }
	to { opacity: 1; transform: translateY(0); }
}
@keyframes bk-fade {
	from { opacity: 0; }
	to { opacity: 1; }
}
.bk-rise { animation: bk-rise .7s cubic-bezier(0.16, 1, 0.3, 1) both; }
.bk-fade { animation: bk-fade .8s ease both; }

/* Reduced motion */
@media (prefers-reduced-motion: reduce) {
	*, *::before, *::after { animation: none !important; transition: none !important; }
}

/* ---------- Utility ---------- */
.bk-hide-mobile { display: none; }
@media (min-width: 800px) { .bk-hide-mobile { display: initial; } .bk-hide-desktop { display: none; } }

.bk-grain {
	position: absolute;
	inset: 0;
	pointer-events: none;
	opacity: 0.5;
	mix-blend-mode: multiply;
	background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.5'/%3E%3C/svg%3E");
	background-size: 200px 200px;
}

/* =============================================================================
   Premium polish — trust-bar with claim, header actions (search + cart),
   newsletter, footer trust badges.
   ============================================================================= */

/* ---------- Trust-bar claim (link inde i marquee) ---------- */
.bk-trust-bar__claim {
	display: inline-flex; align-items: center; gap: 8px;
	color: var(--bk-cream-50);
	text-decoration: none;
	font-size: 0.78rem;
	letter-spacing: 0.02em;
	white-space: nowrap;
}
.bk-trust-bar__claim:hover {
	color: var(--bk-saffron);
	text-decoration: none;
}
.bk-trust-bar__claim-text {
	font-weight: 600;
	color: var(--bk-cream-50);
}
.bk-trust-bar__claim-dot {
	width: 6px; height: 6px; border-radius: 50%;
	background: var(--bk-saffron);
	box-shadow: 0 0 0 2.5px rgba(198, 154, 79, 0.32);
	animation: bk-claim-pulse 2.4s ease-in-out infinite;
	flex-shrink: 0;
}
@keyframes bk-claim-pulse {
	0%, 100% { box-shadow: 0 0 0 2.5px rgba(198, 154, 79, 0.32); }
	50% { box-shadow: 0 0 0 5px rgba(198, 154, 79, 0.18); }
}
@media (prefers-reduced-motion: reduce) {
	.bk-trust-bar__claim-dot { animation: none; }
}

/* ---------- Header actions (cart + buy CTA) ---------- */
.bk-header__actions {
	display: inline-flex; align-items: center; gap: 10px;
	flex-shrink: 0;
}
/* Buy CTA shows alongside the inline desktop nav (≥1024px); on smaller screens
   the hamburger + cart carry the header, so the CTA would only crowd it. */
.bk-header__cta { display: none; }
@media (min-width: 1024px) {
	.bk-header__cta {
		display: inline-flex;
		min-height: 0;
		padding: 0.5rem 1.05rem;
		font-size: 0.9rem;
	}
}

/* ---------- Footer contact block (replaces newsletter) ---------- */
.bk-footer__contact {
	width: 100%;
	max-width: 480px;
	margin: 0;
	padding: var(--bk-space-5) var(--bk-space-6);
	background: rgba(252, 249, 244, 0.04);
	border: 1px solid rgba(252, 249, 244, 0.10);
	border-radius: var(--bk-radius);
	position: relative;
}
.bk-footer__contact::before {
	content: "";
	position: absolute;
	top: -1px; left: var(--bk-space-6);
	width: 40px; height: 2px;
	background: linear-gradient(90deg, var(--bk-saffron), transparent);
	border-radius: 2px;
}
.bk-footer__contact-title {
	font-family: var(--bk-font-display);
	font-style: italic;
	font-size: 1.05rem;
	font-weight: 400;
	color: var(--bk-saffron);
	letter-spacing: 0;
	margin: 0 0 var(--bk-space-3);
	font-variation-settings: "opsz" 60, "SOFT" 70;
	text-transform: none;
}
.bk-footer__contact-list {
	margin: 0;
	display: flex;
	flex-direction: column;
	gap: var(--bk-space-3);
}
.bk-footer__contact-row {
	display: grid;
	grid-template-columns: 78px 1fr;
	align-items: baseline;
	gap: var(--bk-space-3);
	padding-bottom: var(--bk-space-3);
	border-bottom: 1px dashed rgba(252, 249, 244, 0.08);
}
.bk-footer__contact-row:last-child { border-bottom: 0; padding-bottom: 0; }
.bk-footer__contact-row dt {
	font-size: 0.7rem;
	font-weight: 700;
	letter-spacing: 0.16em;
	text-transform: uppercase;
	color: rgba(252, 249, 244, 0.45);
	margin: 0;
}
.bk-footer__contact-row dd {
	margin: 0;
	font-size: 0.92rem;
	color: rgba(252, 249, 244, 0.85);
	line-height: 1.45;
}
.bk-footer__contact-row dd a {
	color: var(--bk-cream-50);
	font-weight: 500;
}
.bk-footer__contact-row dd a:hover { color: var(--bk-saffron); text-decoration: none; }
.bk-footer__contact-meta {
	display: block;
	font-size: 0.74rem;
	color: rgba(252, 249, 244, 0.45);
	margin-top: 2px;
	letter-spacing: 0.02em;
}
.bk-footer__contact-link {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	margin-top: var(--bk-space-4);
	font-size: 0.82rem;
	font-weight: 600;
	letter-spacing: 0.04em;
	color: var(--bk-saffron);
	text-decoration: none;
	transition: gap 180ms ease;
}
.bk-footer__contact-link:hover {
	color: var(--bk-cream-50);
	gap: 10px;
	text-decoration: none;
}

.bk-footer__badges {
	display: flex; flex-wrap: wrap; gap: var(--bk-space-2);
	margin: 0;
	padding: 0;
}
.bk-footer__badge {
	display: inline-flex; align-items: center; gap: 6px;
	padding: 6px 12px;
	background: rgba(252, 249, 244, 0.04);
	border: 1px solid rgba(252, 249, 244, 0.12);
	border-radius: 999px;
	font-size: 0.74rem;
	color: rgba(252, 249, 244, 0.78);
}
.bk-footer__badge::before {
	content: "✓";
	color: var(--bk-saffron);
	font-weight: 700;
}

.bk-footer__trustpilot {
	display: inline-flex; align-items: center; gap: 8px;
	margin: 0;
	padding: 8px 14px;
	background: rgba(252, 249, 244, 0.05);
	border: 1px solid rgba(252, 249, 244, 0.12);
	border-radius: 8px;
}
.bk-footer__trustpilot-stars {
	color: #00b67a;
	font-size: 1.2rem;
	letter-spacing: 1px;
}
.bk-footer__trustpilot-text {
	font-size: 0.78rem;
	color: rgba(252, 249, 244, 0.78);
}
.bk-footer__trustpilot-rating {
	font-weight: 700;
	color: var(--bk-cream-50);
}

/* ---------- Contact list (kontakt page) ---------- */
.bk-contact-list {
	list-style: none; padding: 0;
	display: flex; flex-direction: column; gap: var(--bk-space-4);
	margin: var(--bk-space-6) 0;
}
.bk-contact-list li {
	padding: var(--bk-space-4) var(--bk-space-5);
	background: var(--bk-color-surface);
	border: 1px solid rgba(31, 26, 20, 0.08);
	border-radius: 12px;
	font-size: 0.96rem;
	line-height: 1.5;
}
.bk-contact-list li strong {
	display: block;
	font-size: 0.82rem;
	font-weight: 600;
	color: var(--bk-stone-700);
	margin-bottom: 2px;
}
.bk-contact-list li a {
	font-weight: 500;
	color: var(--bk-cinnamon);
}

/* ---------- Lead paragraph (used in trust pages) ---------- */
.bk-lead {
	font-size: var(--bk-fs-500);
	color: var(--bk-stone-700);
	line-height: 1.6;
	font-weight: 400;
}

/* ---------- Footer payment strip (Betaling / Tryghed / Sikker shopping) ---------- */
.bk-payment-strip {
	display: grid;
	grid-template-columns: 1fr;
	gap: var(--bk-space-6);
	margin: var(--bk-space-6) 0 var(--bk-space-4);
	padding: var(--bk-space-6) 0;
	border-top: 1px solid rgba(252, 249, 244, 0.10);
}
@media (min-width: 768px) {
	.bk-payment-strip {
		grid-template-columns: auto minmax(0, 1fr) auto;
		gap: var(--bk-space-10);
		align-items: start;
	}
}
/* Trust badges flow horizontally (and wrap) — they used to be forced into a
   vertical column, which read as a stray list of pills standing on end. */
.bk-payment-strip__col--badges .bk-footer__badges {
	flex-direction: row;
	flex-wrap: wrap;
	align-items: center;
	gap: var(--bk-space-2);
}
.bk-payment-strip__title {
	font-size: 0.86rem;
	font-weight: 600;
	letter-spacing: 0.01em;
	color: var(--bk-cream-50);
	margin: 0 0 var(--bk-space-3);
}
.bk-payment-strip__icons {
	display: flex; flex-wrap: wrap; gap: 4px;
	align-items: center;
}
.bk-payment-strip__icons svg {
	flex-shrink: 0;
	width: 46px; height: 32px;
	display: block;
}

/* =============================================================================
   Contrast safety net — guard against dark-on-dark / light-on-light edge cases.
   ============================================================================= */

/* Dark surfaces (footer, CTA band, rupture, cookie banner) — anything inside
   them that defaults to dark-on-cream needs to be lifted to cream-on-dark. */
.bk-footer .bk-card,
.bk-footer .woocommerce-message,
.bk-footer .woocommerce-info,
.bk-cta-band .bk-card {
	background: rgba(252, 249, 244, 0.06);
	color: var(--bk-cream-50);
	border-color: rgba(252, 249, 244, 0.12);
}
.bk-footer p,
.bk-footer li,
.bk-footer dd,
.bk-footer dt {
	color: rgba(252, 249, 244, 0.78);
}
.bk-footer h1, .bk-footer h2, .bk-footer h3, .bk-footer h4, .bk-footer h5,
.bk-cta-band h1, .bk-cta-band h2, .bk-cta-band h3,
.bk-rupture h1, .bk-rupture h2, .bk-rupture h3,
.bk-page-hero--ink h1, .bk-page-hero--ink h2, .bk-page-hero--ink h3,
.bk-feature-split--ink h1, .bk-feature-split--ink h2, .bk-feature-split--ink h3, .bk-feature-split--ink h4,
.bk-cat-tile--ink h1, .bk-cat-tile--ink h2, .bk-cat-tile--ink h3, .bk-cat-tile--ink h4,
.bk-size-card.is-popular h1, .bk-size-card.is-popular h2, .bk-size-card.is-popular h3 {
	color: var(--bk-cream-50);
}
.bk-cat-tile--ink p,
.bk-page-hero--ink p,
.bk-feature-split--ink p,
.bk-rupture p {
	color: rgba(252, 249, 244, 0.82);
}
.bk-cta-band .bk-btn--secondary,
.bk-cta-band .bk-btn--ghost {
	color: var(--bk-cream-50) !important;
	border-color: rgba(252, 249, 244, 0.3);
	box-shadow: inset 0 0 0 1px rgba(252, 249, 244, 0.3);
}
.bk-cta-band .bk-btn--secondary:hover,
.bk-cta-band .bk-btn--ghost:hover {
	color: var(--bk-ink) !important;
	background: var(--bk-cream-50);
	border-color: var(--bk-cream-50);
	box-shadow: inset 0 0 0 1px var(--bk-cream-50);
}

/* Light surfaces — make sure default text isn't washed out on cream cards. */
.bk-card,
.bk-card p,
.bk-card li {
	color: var(--bk-stone-700);
}
.bk-card h2, .bk-card h3, .bk-card h4 {
	color: var(--bk-espresso);
}

/* Inline links inside light backgrounds need enough contrast — cinnamon meets
   AA on cream/white. Don't let it drop to stone-500. */
.bk-page a:not([class]),
.bk-main a:not([class]) {
	color: var(--bk-cinnamon);
}

/* Pre-footer and footer: the section before footer should not leave a cream
   gap. Sections already have their own bottom padding; the footer's
   margin-top has been removed above. Keep this rule to avoid stray space
   coming back via .bk-section utilities or page templates. */
.bk-cta-band + .bk-footer,
.bk-rupture + .bk-footer,
.bk-front-tradition + .bk-footer { margin-top: 0; }

/* =============================================================================
   Toast + fly-to-cart — global because the cart drawer & loop AJAX run on
   every page that has a header.
   ============================================================================= */
.bk-toast {
	position: fixed;
	left: 50%;
	bottom: var(--bk-space-6);
	transform: translateX(-50%) translateY(20px);
	background: var(--bk-ink);
	color: var(--bk-cream-50);
	padding: 0.85rem 1.2rem;
	border-radius: 999px;
	box-shadow: 0 22px 50px -16px rgba(0,0,0,0.4);
	display: inline-flex;
	align-items: center;
	gap: 0.55rem;
	font-size: 0.92rem;
	font-weight: 500;
	z-index: 200;
	opacity: 0;
	transition: transform .26s cubic-bezier(0.16, 1, 0.3, 1), opacity .22s ease;
	pointer-events: none;
	max-width: calc(100vw - 2rem);
}
.bk-toast.is-visible { transform: translateX(-50%) translateY(0); opacity: 1; }
.bk-toast__icon {
	width: 18px; height: 18px;
	border-radius: 50%;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	font-weight: 700;
	font-size: 0.78rem;
	background: var(--bk-success);
	color: #fff;
}
.bk-toast--ok .bk-toast__icon::before { content: "✓"; }
.bk-toast--err .bk-toast__icon { background: var(--bk-danger); }
.bk-toast--err .bk-toast__icon::before { content: "!"; }

.bk-cart-fly {
	position: fixed;
	z-index: 199;
	width: 14px; height: 14px;
	border-radius: 50%;
	background: var(--bk-cinnamon);
	box-shadow: 0 0 0 4px rgba(164, 71, 33, 0.18);
	pointer-events: none;
	transition: transform .65s cubic-bezier(0.7, 0.0, 0.84, 0.0), opacity .65s ease;
	will-change: transform, opacity;
}

@media (prefers-reduced-motion: reduce) {
	.bk-toast { transition: opacity .15s ease; transform: translateX(-50%); }
	.bk-cart-fly { display: none; }
}

/* =============================================================================
   Sticky bottom CTA — generic mobil/tablet-bar (single product, kurv, checkout).
   Vises kun under lg-bruddet (1024px). Skjules som default; JS slår
   .is-visible til når reference-elementet (fx pack-builder) er ude af viewport.
   ============================================================================= */
.bk-sticky-cta {
	position: fixed;
	left: 0;
	right: 0;
	bottom: 0;
	z-index: 80;
	display: none;
	background: rgba(252, 249, 244, 0.96);
	backdrop-filter: saturate(180%) blur(14px);
	-webkit-backdrop-filter: saturate(180%) blur(14px);
	border-top: 1px solid rgba(31, 26, 20, 0.08);
	box-shadow: 0 -10px 28px -16px rgba(31, 26, 20, 0.18);
	padding: 0.6rem var(--bk-space-4) calc(0.6rem + env(safe-area-inset-bottom, 0px));
	transform: translateY(calc(100% + env(safe-area-inset-bottom, 0px)));
	transition: transform .28s cubic-bezier(0.16, 1, 0.3, 1);
	pointer-events: none;
}
@media (max-width: 1023.98px) {
	.bk-sticky-cta { display: block; }
}
.bk-sticky-cta.is-visible {
	transform: translateY(0);
	pointer-events: auto;
}
.bk-sticky-cta__inner {
	display: grid;
	grid-template-columns: 1fr auto;
	gap: var(--bk-space-3);
	align-items: center;
	max-width: var(--bk-container);
	margin-inline: auto;
}
.bk-sticky-cta__info {
	display: flex;
	flex-direction: column;
	gap: 2px;
	min-width: 0;
}
.bk-sticky-cta__label {
	font-size: 0.7rem;
	font-weight: 700;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	color: var(--bk-stone-500);
	line-height: 1;
}
.bk-sticky-cta__price {
	font-family: var(--bk-font-display);
	font-size: 1.3rem;
	font-weight: 500;
	color: var(--bk-cinnamon);
	letter-spacing: -0.01em;
	font-variant-numeric: tabular-nums;
	line-height: 1.1;
	font-variation-settings: "opsz" 96, "SOFT" 50;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}
.bk-sticky-cta__btn {
	min-height: 52px;
	padding: 0.85rem 1.4rem;
	font-size: 0.96rem;
	letter-spacing: 0.005em;
	font-weight: 600;
	white-space: nowrap;
}

/* Page-bottom spacer — sat på <body> når sticky bar er aktiv, så
   sidste indhold ikke skjules bag baren ved scroll-end. */
@media (max-width: 1023.98px) {
	body.bk-has-sticky-cta { padding-bottom: calc(var(--bk-sticky-cta-height) + env(safe-area-inset-bottom, 0px)); }
}

@media (prefers-reduced-motion: reduce) {
	.bk-sticky-cta { transition: none; }
}

/* =============================================================================
   Footer heading-element demotions (kept visually identical to the old
   <h3>/<h4> markup; selectors prefixed with .bk-footer so they beat the
   generic ".bk-footer p" colour rule).
   ============================================================================= */
.bk-footer p.bk-footer__brand-claim-wrap {
	color: #fff;
	font-family: var(--bk-font-display);
	font-size: var(--bk-fs-800);
	line-height: 1.05;
	margin: 0;
	max-width: 18ch;
}
.bk-footer p.bk-footer__brand-claim-wrap em {
	font-style: italic;
	color: var(--bk-saffron);
	font-variation-settings: "opsz" 144, "SOFT" 70;
}
.bk-footer p.bk-footer__col-title {
	color: var(--bk-saffron);
	font-family: var(--bk-font-body);
	font-size: 0.78rem;
	font-weight: 700;
	margin: 0 0 var(--bk-space-4);
	text-transform: uppercase;
	letter-spacing: 0.18em;
}
.bk-footer p.bk-footer__contact-title { color: var(--bk-saffron); }
.bk-footer p.bk-payment-strip__title { color: var(--bk-cream-50); margin: 0 0 var(--bk-space-3); }

/* =============================================================================
   Discreet social-share row (Facebook / WhatsApp / copy link). No JS deps.
   ============================================================================= */
.bk-share {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: var(--bk-space-3);
	margin: var(--bk-space-10) auto 0;
	padding: var(--bk-space-5) var(--bk-space-2) 0;
	max-width: 760px;
	border-top: 1px solid var(--bk-stone-300);
}
.bk-share__label {
	font-size: var(--bk-fs-300);
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.12em;
	color: var(--bk-stone-500);
}
.bk-share__btn {
	display: inline-flex;
	align-items: center;
	gap: 0.45rem;
	padding: 0.5rem 0.85rem;
	font: inherit;
	font-size: var(--bk-fs-300);
	font-weight: 600;
	line-height: 1;
	color: var(--bk-stone-700);
	background: var(--bk-cream-100);
	border: 1px solid var(--bk-stone-300);
	border-radius: 999px;
	cursor: pointer;
	text-decoration: none;
	transition: color .12s ease, background-color .12s ease, border-color .12s ease, transform .12s ease;
}
.bk-share__btn:hover,
.bk-share__btn:focus-visible {
	color: var(--bk-cinnamon-900);
	background: var(--bk-cinnamon-50);
	border-color: var(--bk-cinnamon-200);
	text-decoration: none;
	transform: translateY(-1px);
}
.bk-share__icon { flex: 0 0 auto; }
.bk-share__btn--fb:hover .bk-share__icon { color: #1877f2; }
.bk-share__btn--wa:hover .bk-share__icon { color: #25d366; }
.bk-share__btn.is-copied {
	color: var(--bk-success);
	background: var(--bk-success-soft);
	border-color: var(--bk-success);
}
@media (max-width: 480px) {
	.bk-share { gap: var(--bk-space-2); padding-top: var(--bk-space-4); }
	.bk-share__text { font-size: var(--bk-fs-300); }
}

/* =============================================================================
   Promo bar (top) — static USP strip, global (sits above the sticky header).
   ============================================================================= */
.bk-promobar {
	background: var(--bk-ink);
	color: var(--bk-cream-50);
	font-size: 0.82rem;
	line-height: 1.2;
}
.bk-promobar__inner {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: center;
	gap: 0.5rem 0.85rem;
	min-height: var(--bk-trust-bar-height);
	padding-block: 0.4rem;
	text-align: center;
}
.bk-promobar__item {
	display: inline-flex;
	align-items: center;
	gap: 0.4rem;
	white-space: nowrap;
	color: rgba(255, 253, 251, 0.92);
}
.bk-promobar__item svg { width: 15px; height: 15px; color: var(--bk-saffron); flex: 0 0 auto; }
.bk-promobar__sep { color: rgba(255, 253, 251, 0.35); }
@media (max-width: 600px) {
	.bk-promobar__sep { display: none; }
	.bk-promobar__inner { gap: 0.25rem 1rem; }
}

/* =============================================================================
   Shared section headers (front-page + archive intros).
   ============================================================================= */
.bk-section-head {
	max-width: 760px;
	margin: 0 auto var(--bk-space-10);
	text-align: center;
}
.bk-section-head h2 { margin-bottom: var(--bk-space-3); }
.bk-section-lead {
	color: var(--bk-stone-700);
	font-size: var(--bk-fs-500);
	margin: 0 auto;
	max-width: 64ch;
}
.bk-eyebrow--center { display: block; text-align: center; }

/* Guest-count pSEO page stat row. */
.bk-guest-stats {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: var(--bk-space-4);
	margin: var(--bk-space-8) 0;
	text-align: center;
}
.bk-guest-stat {
	background: var(--bk-color-surface);
	border: 1px solid var(--bk-stone-300);
	border-radius: var(--bk-radius);
	padding: var(--bk-space-5) var(--bk-space-3);
}
.bk-guest-stat__num {
	display: block;
	font-family: var(--bk-font-display);
	font-size: clamp(1.4rem, 1.5vw + 1rem, 2rem);
	font-weight: 700;
	color: var(--bk-cinnamon);
}
.bk-guest-stat__label {
	display: block;
	font-size: 0.78rem;
	text-transform: uppercase;
	letter-spacing: 0.08em;
	color: var(--bk-stone-500);
	margin-top: 0.25rem;
}
@media (max-width: 520px) { .bk-guest-stats { grid-template-columns: 1fr; } }

/* =============================================================================
   Cinnamon calculator — shared component (front page, kanel category, pSEO pages).
   ============================================================================= */
.bk-calc { background: linear-gradient(180deg, var(--bk-cream-100) 0%, var(--bk-cream-50) 100%); }
.bk-calc__card {
	max-width: 880px;
	margin-inline: auto;
	background: var(--bk-color-surface);
	border: 1px solid var(--bk-stone-300);
	border-radius: var(--bk-radius-lg);
	box-shadow: var(--bk-shadow);
	padding: clamp(1.5rem, 3vw, 3rem);
}
.bk-calc__head { text-align: center; max-width: 600px; margin-inline: auto; }
.bk-calc__head h2 { margin: var(--bk-space-2) 0 var(--bk-space-3); font-size: clamp(1.6rem, 2.2vw + 1rem, 2.4rem); }
.bk-calc__sub { color: var(--bk-stone-700); font-size: var(--bk-fs-500); margin: 0 auto; max-width: 50ch; }
.bk-calc__form {
	display: grid;
	grid-template-columns: 1fr;
	gap: var(--bk-space-6);
	margin-top: var(--bk-space-8);
}
@media (min-width: 720px) { .bk-calc__form { grid-template-columns: 1fr 1.5fr; align-items: start; } }
.bk-calc__field { display: flex; flex-direction: column; gap: 0.5rem; }
.bk-calc__label { font-weight: 700; color: var(--bk-espresso); font-size: 0.98rem; }
.bk-calc__field input[type="number"] {
	font-family: var(--bk-font-display);
	font-size: 2rem;
	font-weight: 700;
	min-height: 60px;
	padding: 0.5rem 1rem;
	border: 1.5px solid var(--bk-stone-300);
	border-radius: var(--bk-radius);
	background: var(--bk-cream-50);
	color: var(--bk-espresso);
	width: 100%;
}
.bk-calc__field input[type="number"]:focus-visible {
	outline: none;
	border-color: var(--bk-cinnamon);
	box-shadow: 0 0 0 4px rgba(184, 111, 58, 0.14);
}
.bk-calc__intensity { border: 0; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 0.6rem; }
.bk-calc__chip {
	display: flex;
	align-items: center;
	gap: 0.7rem;
	border: 1.5px solid var(--bk-stone-300);
	border-radius: var(--bk-radius);
	padding: 0.8rem 1rem;
	cursor: pointer;
	transition: border-color .15s ease, background-color .15s ease, box-shadow .15s ease;
}
.bk-calc__chip:hover { border-color: var(--bk-cinnamon-200); }
.bk-calc__chip input { accent-color: var(--bk-cinnamon); width: 18px; height: 18px; }
.bk-calc__chip span { font-weight: 600; color: var(--bk-espresso); }
.bk-calc__chip small { display: block; font-weight: 400; color: var(--bk-stone-500); }
.bk-calc__chip:has(input:checked) {
	border-color: var(--bk-cinnamon);
	background: var(--bk-cinnamon-50);
	box-shadow: 0 4px 14px -6px rgba(184, 111, 58, 0.4);
}
.bk-calc__result { margin-top: var(--bk-space-8); border-top: 1px solid var(--bk-stone-300); padding-top: var(--bk-space-6); }
.bk-calc__metrics {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: var(--bk-space-4);
	margin: 0 0 var(--bk-space-5);
}
.bk-calc__metrics div { text-align: center; }
.bk-calc__metrics dt {
	font-size: 0.74rem;
	text-transform: uppercase;
	letter-spacing: 0.1em;
	font-weight: 700;
	color: var(--bk-stone-500);
	margin-bottom: 0.35rem;
}
.bk-calc__metrics dd {
	margin: 0;
	font-family: var(--bk-font-display);
	font-size: clamp(1.3rem, 1vw + 1rem, 1.85rem);
	font-weight: 700;
	color: var(--bk-cinnamon);
	font-variant-numeric: tabular-nums;
}
.bk-calc__hint { text-align: center; color: var(--bk-stone-700); font-size: 0.92rem; margin: 0 0 var(--bk-space-4); min-height: 1.2em; }

/* ---- Inline variant: wide, low-height card (used on /butik) -----------------
   Goal: keep the widget as SHORT as possible so it doesn't push the product
   grid down. On wide screens the head, form and result sit in one horizontal
   row (no separate head row), and all vertical padding/gaps are tightened. */
.bk-calc--inline.bk-section { padding-block: var(--bk-space-8); }
.bk-calc--inline .bk-calc__card {
	max-width: 1180px;
	padding: clamp(1.25rem, 2vw, 1.75rem);
	display: grid;
	grid-template-columns: 1fr;
	gap: var(--bk-space-5);
}
/* Tablet: head on top, form + result side by side. */
@media (min-width: 720px) and (max-width: 991.98px) {
	.bk-calc--inline .bk-calc__card {
		grid-template-columns: 1.4fr 1fr;
		column-gap: var(--bk-space-8);
		row-gap: var(--bk-space-5);
		align-items: start;
	}
	.bk-calc--inline .bk-calc__head { grid-column: 1 / -1; }
}
/* Wide: head | form | result on a single low row. */
@media (min-width: 992px) {
	.bk-calc--inline .bk-calc__card {
		grid-template-columns: 0.95fr 1.15fr 1fr;
		column-gap: var(--bk-space-8);
		align-items: center;
	}
	.bk-calc--inline .bk-calc__result {
		border-left: 1px solid var(--bk-stone-300);
		padding-left: var(--bk-space-8);
	}
}
.bk-calc--inline .bk-calc__head { text-align: left; max-width: none; margin-inline: 0; }
.bk-calc--inline .bk-calc__head h2 { margin: 0 0 var(--bk-space-2); font-size: clamp(1.3rem, 1vw + 0.95rem, 1.7rem); line-height: 1.2; }
.bk-calc--inline .bk-calc__sub { margin: 0; max-width: 60ch; font-size: var(--bk-fs-300); line-height: 1.4; }
.bk-calc--inline .bk-calc__form { margin-top: 0; grid-template-columns: 1fr; gap: var(--bk-space-4); align-content: start; }
.bk-calc--inline .bk-calc__field { gap: 0.35rem; }
.bk-calc--inline .bk-calc__field input[type="number"] { min-height: 46px; font-size: 1.5rem; }
.bk-calc--inline .bk-calc__intensity { display: grid; grid-template-columns: 1fr; gap: 0.5rem; }
@media (min-width: 520px) {
	.bk-calc--inline .bk-calc__intensity { grid-template-columns: repeat(3, 1fr); }
}
.bk-calc--inline .bk-calc__chip { padding: 0.55rem 0.6rem; }
.bk-calc--inline .bk-calc__result { margin-top: 0; padding-top: 0; border-top: 0; }
.bk-calc--inline .bk-calc__hint { margin-bottom: var(--bk-space-3); }
.bk-calc--inline .bk-calc__metrics { gap: var(--bk-space-3); margin-bottom: var(--bk-space-3); }
.bk-calc--inline .bk-calc__metrics dd { font-size: clamp(1.15rem, 0.8vw + 0.9rem, 1.5rem); }

/* =============================================================================
   Footer — "impressive" visual upgrade.
   Layers a glowing gold edge-line, an oversized ghost wordmark, a USP ribbon,
   animated gold accents and refined micro-interactions on top of the existing
   footer structure. Built entirely from existing brand tokens — no new colours.
   ============================================================================= */

/* Glowing gold edge-line that separates the footer from the page above it. */
.bk-footer {
	border-top: 1px solid rgba(198, 154, 79, 0.28);
	padding-top: var(--bk-space-12);
}
.bk-footer::after {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	height: 3px;
	background: linear-gradient(
		90deg,
		transparent 0%,
		var(--bk-cinnamon) 16%,
		var(--bk-saffron) 50%,
		var(--bk-cinnamon) 84%,
		transparent 100%
	);
	box-shadow: 0 0 24px 1px rgba(198, 154, 79, 0.35);
	pointer-events: none;
	z-index: 2;
}
/* Keep all real content above the watermark + atmosphere layers. */
.bk-footer > .bk-container { z-index: 1; }

/* Oversized faded brand wordmark, fading downward, sitting behind everything. */
.bk-footer__watermark {
	position: absolute;
	left: 50%;
	bottom: -0.16em;
	transform: translateX(-50%);
	margin: 0;
	font-family: var(--bk-font-display);
	font-style: italic;
	font-weight: 700;
	font-size: clamp(4rem, 21vw, 19rem);
	line-height: 0.8;
	letter-spacing: -0.02em;
	white-space: nowrap;
	background: linear-gradient(180deg, rgba(198, 154, 79, 0.13), rgba(198, 154, 79, 0));
	-webkit-background-clip: text;
	background-clip: text;
	-webkit-text-fill-color: transparent;
	color: transparent;
	pointer-events: none;
	user-select: none;
	z-index: 0;
}

/* ---- USP ribbon (delivery / speed / security / returns) ---- */
.bk-footer__usps {
	display: grid;
	grid-template-columns: 1fr;
	gap: var(--bk-space-4);
	margin: 0 0 var(--bk-space-12);
	padding-bottom: var(--bk-space-10);
	border-bottom: 1px solid rgba(252, 249, 244, 0.08);
}
@media (min-width: 640px) {
	.bk-footer__usps { grid-template-columns: repeat(2, 1fr); gap: var(--bk-space-5) var(--bk-space-8); }
}
@media (min-width: 1024px) {
	.bk-footer__usps { grid-template-columns: repeat(4, 1fr); }
}
.bk-footer__usp {
	display: flex;
	align-items: center;
	gap: var(--bk-space-3);
}
.bk-footer__usp-icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	flex: 0 0 auto;
	width: 46px;
	height: 46px;
	border-radius: 50%;
	color: var(--bk-saffron);
	background: radial-gradient(circle at 32% 28%, rgba(198, 154, 79, 0.24), rgba(198, 154, 79, 0.05));
	border: 1px solid rgba(198, 154, 79, 0.3);
	transition: transform 0.18s ease, box-shadow 0.18s ease, border-color 0.18s ease;
}
.bk-footer__usp-icon svg { width: 22px; height: 22px; }
.bk-footer__usp:hover .bk-footer__usp-icon {
	transform: translateY(-2px);
	border-color: var(--bk-saffron);
	box-shadow: 0 10px 22px -12px rgba(198, 154, 79, 0.6);
}
.bk-footer__usp-text { display: flex; flex-direction: column; line-height: 1.25; }
.bk-footer .bk-footer__usp-text strong { color: var(--bk-cream-50); font-size: 0.94rem; font-weight: 700; }
.bk-footer .bk-footer__usp-text span { color: rgba(252, 249, 244, 0.58); font-size: 0.8rem; }

/* ---- Shimmering gold brand-claim accent ---- */
.bk-footer p.bk-footer__brand-claim-wrap em {
	background: linear-gradient(
		100deg,
		var(--bk-saffron) 0%,
		#f3ddb0 28%,
		var(--bk-cinnamon-200) 50%,
		#f3ddb0 72%,
		var(--bk-saffron) 100%
	);
	background-size: 220% auto;
	-webkit-background-clip: text;
	background-clip: text;
	-webkit-text-fill-color: transparent;
	color: transparent;
	animation: bk-footer-shimmer 7s linear infinite;
}
@keyframes bk-footer-shimmer { to { background-position: 220% center; } }

/* ---- Column titles: gold underline accent ---- */
.bk-footer p.bk-footer__col-title {
	position: relative;
	padding-bottom: 0.6rem;
	margin-bottom: var(--bk-space-4);
}
.bk-footer p.bk-footer__col-title::after {
	content: "";
	position: absolute;
	left: 0;
	bottom: 0;
	width: 28px;
	height: 2px;
	background: linear-gradient(90deg, var(--bk-saffron), transparent);
	border-radius: 2px;
}

/* ---- Column links: sliding gold underline on hover ---- */
.bk-footer__col a {
	display: inline-block;
	background-image: linear-gradient(var(--bk-saffron), var(--bk-saffron));
	background-size: 0% 1px;
	background-repeat: no-repeat;
	background-position: 0 100%;
	transition: background-size 0.22s ease, color 0.15s ease;
}
.bk-footer__col a:hover { color: #fff; text-decoration: none; background-size: 100% 1px; }

/* ---- Trustpilot + trust badges polish ---- */
.bk-footer__trustpilot-stars { text-shadow: 0 0 12px rgba(0, 182, 122, 0.45); }
.bk-footer__badge { transition: background 0.15s ease, border-color 0.15s ease, transform 0.15s ease; }
.bk-footer__badge:hover {
	background: rgba(198, 154, 79, 0.08);
	border-color: rgba(198, 154, 79, 0.4);
	transform: translateY(-1px);
}

/* ---- Contact card: warmer glass + depth ---- */
.bk-footer__contact {
	background: linear-gradient(160deg, rgba(252, 249, 244, 0.06), rgba(252, 249, 244, 0.02));
	box-shadow: 0 26px 60px -42px rgba(0, 0, 0, 0.85);
}

/* ---- Payment / secure icons: subtle lift ---- */
.bk-payment-strip__icons svg {
	border-radius: 6px;
	box-shadow: 0 2px 8px -4px rgba(0, 0, 0, 0.55);
	transition: transform 0.15s ease, box-shadow 0.15s ease;
}
.bk-payment-strip__icons svg:hover {
	transform: translateY(-2px);
	box-shadow: 0 9px 16px -8px rgba(0, 0, 0, 0.7);
}

/* ---- Bottom bar + back-to-top pill ---- */
.bk-footer__bottom { justify-content: flex-start; }
.bk-footer__legal { margin-left: auto; }
.bk-footer__totop {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	padding: 0.5rem 0.95rem;
	border-radius: 999px;
	font-size: 0.8rem;
	font-weight: 600;
	letter-spacing: 0.04em;
	color: var(--bk-cream-50);
	background: rgba(252, 249, 244, 0.04);
	border: 1px solid rgba(198, 154, 79, 0.3);
	transition: background 0.18s ease, border-color 0.18s ease, color 0.18s ease, transform 0.18s ease;
}
.bk-footer__totop:hover {
	background: rgba(198, 154, 79, 0.14);
	border-color: var(--bk-saffron);
	color: #fff;
	text-decoration: none;
	transform: translateY(-2px);
}
.bk-footer__totop-arrow { display: inline-flex; transition: transform 0.18s ease; }
.bk-footer__totop:hover .bk-footer__totop-arrow { transform: translateY(-2px); }

/* Ghost buttons on the dark footer (e.g. "Kontakt os"): the global ghost-hover
   flips the background to light cream, which made the cream text disappear.
   Keep it dark-on-dark instead — translucent fill, bright border, cream text. */
.bk-footer .bk-btn--ghost:hover {
	background: rgba(252, 249, 244, 0.08);
	color: var(--bk-cream-50) !important;
	box-shadow: inset 0 0 0 1px rgba(252, 249, 244, 0.55) !important;
	border-color: transparent;
}

/* Smooth scroll for the back-to-top jump (motion-safe only). */
@media (prefers-reduced-motion: no-preference) {
	html { scroll-behavior: smooth; }
}
@media (prefers-reduced-motion: reduce) {
	.bk-footer p.bk-footer__brand-claim-wrap em { animation: none; }
}


/* CRO additions (ecommerce-cro-auditor) */
/* Trustpilot rating badge — reusable across header promobar, checkout trust
   strip, testimonials and product social proof. Renders only when real stats
   are configured (bk_get_brand_stats); see inc/helpers.php. */
.bk-rating-badge {
	display: inline-flex;
	align-items: center;
	gap: 0.4rem;
	font-size: 0.82rem;
	line-height: 1.1;
	color: inherit;
	text-decoration: none;
	white-space: nowrap;
}
.bk-rating-badge__stars { color: #00b67a; letter-spacing: 0.04em; font-size: 0.95em; }
.bk-rating-badge__text strong { font-weight: 700; }
.bk-rating-badge__count { color: var(--bk-stone-500); }
.bk-rating-badge[href]:hover .bk-rating-badge__text { text-decoration: underline; }
.bk-promobar__item--rating .bk-rating-badge { font-size: inherit; }
.bk-promobar__item--rating .bk-rating-badge__count { color: inherit; opacity: 0.82; }
.bk-testimonials__rating { display: flex; justify-content: center; margin-top: var(--bk-space-2); }
.bk-rating-badge--testimonials { font-size: 0.95rem; }
.bk-product__social-proof { margin: var(--bk-space-2) 0 var(--bk-space-3); }