/* ==========================================================
   24K Treats header
   < 850px      : centred coin in the mobile strip
   850–1149px   : coin left · nav · order button (compact)
   ≥ 1150px     : boutique layout — nav | coin centred | actions
                  on the homepage the coin hangs over the hero
   ========================================================== */

/* ---------- Top bar ---------- */
.k24-desk #top-bar {
	position: relative;
	background:
		radial-gradient(60% 140% at 50% 0%, rgba(216, 27, 96, .22), transparent 70%),
		var(--k-plum) !important;
	border: 0 !important;
}
.k24-desk #top-bar::after {             /* gold foil rule with a slow shimmer */
	content: "";
	position: absolute;
	left: 0; right: 0; bottom: 0;
	height: 2px;
	background: linear-gradient(90deg, #7d5705, #d4af37, #f6e6a6, #d4af37, #7d5705, #d4af37, #f6e6a6, #d4af37, #7d5705);
	background-size: 200% 100%;
	animation: k24-shimmer 7s linear infinite;
}
@keyframes k24-shimmer { to { background-position: -200% 0; } }

.k24-desk #top-bar .html_topbar_left a,
.k24-desk #top-bar .nav > li > a {
	font-family: var(--k-sans) !important;
	font-size: 12px !important;
	font-weight: 500 !important;
	letter-spacing: .04em;
	color: var(--k-cream) !important;
	opacity: 1 !important;
}
.k24-desk #top-bar .html_topbar_left a::before {
	content: "\2726";
	color: var(--k-gold);
	margin-right: 9px;
	font-size: 11px;
}
.k24-desk #top-bar .html_topbar_left a:hover { color: var(--k-gold-hi) !important; }
.k24-desk #top-bar .social-icons a { color: rgba(251, 246, 236, .8) !important; transition: color .25s, transform .25s; }
.k24-desk #top-bar .social-icons a:hover { color: var(--k-gold) !important; transform: translateY(-1px); }

/* ---------- Strip (all sizes) ---------- */
.k24-desk #masthead.header-main {
	position: relative;
	z-index: 40;
	background: var(--k-paper) !important;
}
.k24-desk #masthead.header-main::after {   /* gold hairline that fades at the ends */
	content: "";
	position: absolute;
	left: 0; right: 0; bottom: 0;
	height: 1px;
	background: linear-gradient(90deg, transparent, rgba(212, 175, 55, .75) 20%, rgba(212, 175, 55, .75) 80%, transparent);
	pointer-events: none;
	z-index: 1;
}
.k24-desk #masthead .header-inner { overflow: visible !important; }
.k24-desk #logo img.header-logo-dark { display: none !important; }

/* coin in the strip */
.k24-desk #logo {
	width: auto !important;
	padding: 0 !important;
	margin: 0 !important;
}
/* coin always sits on top of the gold hairline */
.k24-desk #logo { position: relative; z-index: 5; }
.k24-desk #logo > a.k24-coin { width: 74px; height: 74px; z-index: 5; }
.k24-desk #logo > a.k24-coin:hover { transform: rotate(-8deg) scale(1.03); }

/* ---------- Nav (desktop range) ---------- */
@media (min-width: 850px) {
	.k24-desk #masthead.header-main { height: 96px; }
	.k24-desk #logo { margin-right: 28px !important; }

	.k24-desk #masthead .header-nav-main > li { margin: 0 !important; }
	.k24-desk #masthead .header-nav-main > li > a {
		position: relative;
		padding: 10px 11px !important;
		font-family: var(--k-sans) !important;
		font-size: 14.5px !important;
		font-weight: 600 !important;
		letter-spacing: .005em !important;
		text-transform: none !important;
		color: var(--k-plum) !important;
		background: transparent !important;     /* drop Flatsome's pill */
		border-radius: 0 !important;
		box-shadow: none !important;
		opacity: 1 !important;
		transition: color .25s;
	}
	/* gold diamond under the current page; hairline grows from the centre on hover */
	.k24-desk #masthead .header-nav-main > li > a::before {
		content: "";
		position: absolute;
		left: 50%;
		bottom: -2px;
		width: 7px; height: 7px;
		background: var(--k-foil);
		transform: translateX(-50%) rotate(45deg) scale(0);
		transition: transform .4s var(--k-ease);
	}
	.k24-desk #masthead .header-nav-main > li > a::after {
		content: "";
		position: absolute;
		left: 50%; right: 50%;
		bottom: 1px;
		height: 1px;
		background: var(--k-gold);
		transition: left .45s var(--k-ease), right .45s var(--k-ease);
	}
	.k24-desk #masthead .header-nav-main > li > a:hover { color: var(--k-pink) !important; }
	.k24-desk #masthead .header-nav-main > li > a:hover::after { left: 30%; right: 30%; }
	.k24-desk #masthead .header-nav-main > li.active > a::before,
	.k24-desk #masthead .header-nav-main > li.current-menu-item > a::before,
	.k24-desk #masthead .header-nav-main > li.current-menu-ancestor > a::before {
		transform: translateX(-50%) rotate(45deg) scale(1);
	}
	.k24-desk #masthead .header-nav-main > li.active > a:hover::after,
	.k24-desk #masthead .header-nav-main > li.current-menu-item > a:hover::after { left: 50%; right: 50%; }

	/* dropdowns */
	.k24-desk #masthead .nav-dropdown {
		border: 0 !important;
		border-top: 2px solid var(--k-gold) !important;
		border-radius: 0 0 14px 14px;
		background: var(--k-paper) !important;
		box-shadow: 0 24px 50px -20px rgba(56, 0, 55, .35) !important;
	}
	.k24-desk #masthead .nav-dropdown a {
		font-family: var(--k-sans) !important;
		text-transform: none !important;
		color: var(--k-plum) !important;
	}

	/* ---------- Actions ---------- */
	.k24-desk .k24-actions {
		display: flex;
		align-items: center;
		gap: 10px;
		margin: 0 !important;
		padding: 0 !important;
		list-style: none;
	}
	.k24-desk .k24-actions li { margin: 0 !important; list-style: none; }
	.k24-desk .k24-call {
		width: 44px; height: 44px;
		border-radius: 50%;
		display: inline-flex; align-items: center; justify-content: center;
		color: var(--k-plum) !important;
		border: 1.5px solid rgba(56, 0, 55, .18);
		transition: background .25s, color .25s, border-color .25s, transform .35s var(--k-ease);
	}
	.k24-desk .k24-call svg { width: 18px; height: 18px; }
	.k24-desk .k24-call:hover { background: var(--k-plum); color: var(--k-gold-hi) !important; border-color: var(--k-plum); transform: rotate(-10deg); }
	.k24-desk .k24-order { height: 46px; padding: 0 22px; font-size: 14px; letter-spacing: .02em; }
	.k24-desk .k24-order .k24-long { display: none; }
	.k24-desk .k24-order .k24-short { display: inline; }
}

/* compact desktop / landscape tablet */
@media (min-width: 850px) and (max-width: 999px) {
	.k24-desk .k24-call { display: none !important; }
	.k24-desk #masthead .header-nav-main > li > a { padding: 10px 8px !important; font-size: 14px !important; }
	.k24-desk #logo { margin-right: 14px !important; }
	.k24-desk #logo > a.k24-coin { width: 66px; height: 66px; }
}

/* ---------- Boutique layout (wide) ---------- */
@media (min-width: 1150px) {
	.k24-desk #masthead .header-inner {
		display: grid !important;
		grid-template-columns: 1fr auto 1fr;
		align-items: center;
	}
	/* Flatsome's clearfix pseudo-elements would steal grid cells */
	.k24-desk #masthead .header-inner::before,
	.k24-desk #masthead .header-inner::after { display: none !important; }
	.k24-desk #masthead .header-inner > .hide-for-medium.flex-left  { grid-column: 1; grid-row: 1; justify-self: start; }
	.k24-desk #masthead .header-inner > #logo                      { grid-column: 2; grid-row: 1; justify-self: center; margin: 0 32px !important; }
	.k24-desk #masthead .header-inner > .hide-for-medium.flex-right { grid-column: 3; grid-row: 1; justify-self: end; }
	.k24-desk #masthead .header-inner > .hide-for-medium.flex-left .header-nav-main { justify-content: flex-start; }

	.k24-desk .k24-order .k24-long { display: inline; }
	.k24-desk .k24-order .k24-short { display: none; }
	.k24-desk #logo > a.k24-coin { width: 82px; height: 82px; }

	/* homepage only: the coin hangs over the hero */
	.k24-desk.home .header-wrapper:not(.stuck) #logo {
		align-self: start;
		height: 96px;
		width: 124px !important;
	}
	.k24-desk.home .header-wrapper:not(.stuck) #logo > a.k24-coin {
		position: absolute;
		top: 8px;
		left: 50%;
		margin-left: -62px;
		width: 124px;
		height: 124px;
		padding: 5px;
	}
	.k24-desk.home .header-wrapper:not(.stuck) #logo > a.k24-coin:hover { transform: rotate(-8deg) scale(1.03); }
}

/* ---------- Sticky ---------- */
@media (min-width: 850px) {
	.k24-desk .header-wrapper.stuck #masthead.header-main {
		height: 72px;
		background: rgba(255, 253, 248, .9) !important;
		-webkit-backdrop-filter: saturate(1.3) blur(12px);
		backdrop-filter: saturate(1.3) blur(12px);
		box-shadow: 0 12px 30px -20px rgba(56, 0, 55, .45);
	}
	.k24-desk .header-wrapper.stuck #logo > a.k24-coin { width: 56px; height: 56px; padding: 3px; }
}

/* ---------- Mobile strip ---------- */
@media (max-width: 849px) {
	.k24-desk #logo > a.k24-coin { width: 58px; height: 58px; padding: 3px; box-shadow: 0 0 0 3px var(--k-paper), 0 10px 20px -12px rgba(56, 0, 55, .55); }
	.k24-desk .k24-actions { display: none; }
}

@media (prefers-reduced-motion: reduce) {
	.k24-desk #top-bar::after { animation: none; }
	.k24-desk #masthead *, .k24-desk #masthead *::before, .k24-desk #masthead *::after { transition: none !important; }
}