/* ==========================================================================
   Ayulanka site header — compact single row, all screen sizes
   ========================================================================== */
:root {
	--ayu-h: 84px;          /* desktop height */
	--ayu-h-s: 66px;        /* desktop height after scrolling */
	--ayu-h-m: 66px;        /* mobile height */
	--ayu-h-ms: 58px;       /* mobile height after scrolling */
	--ayu-h-ink: #161310;
	--ayu-h-muted: #6f675d;
	--ayu-h-gold: #b8914a;
	--ayu-h-line: #ece7df;
	--ayu-h-top: 0px;       /* admin bar offset */
}
.admin-bar { --ayu-h-top: 32px; }
@media screen and (max-width: 782px) { .admin-bar { --ayu-h-top: 46px; } }

/* Hide the parent theme's headers (only when ours is on the page) */
body.ayu-has-header .eltd-page-header,
body.ayu-has-header .eltd-sticky-header,
body.ayu-has-header .eltd-mobile-header { display: none !important; }

/* ---------- Bar ---------- */
.ayu-h-spacer { height: var(--ayu-h); }
.ayu-header {
	position: fixed;
	top: var(--ayu-h-top);
	left: 0;
	right: 0;
	z-index: 9990;
	background: rgba(255, 255, 255, .97);
	border-bottom: 1px solid var(--ayu-h-line);
	transition: box-shadow .35s ease, background-color .35s ease;
}
.ayu-header.is-scrolled {
	background: rgba(255, 255, 255, .9);
	-webkit-backdrop-filter: saturate(160%) blur(12px);
	backdrop-filter: saturate(160%) blur(12px);
	box-shadow: 0 8px 30px rgba(22, 19, 16, .07);
}
html body .ayu-header,
html body .ayu-header *,
html body .ayu-drawer,
html body .ayu-drawer * {
	font-family: "EB Garamond", Garamond, Georgia, serif !important;
	box-sizing: border-box;
}
.ayu-h-bar {
	display: grid;
	grid-template-columns: 1fr auto 1fr;
	align-items: center;
	gap: 24px;
	max-width: 1360px;
	height: var(--ayu-h);
	margin: 0 auto;
	padding: 0 40px;
	transition: height .35s cubic-bezier(.16, 1, .3, 1);
}
.ayu-header.is-scrolled .ayu-h-bar { height: var(--ayu-h-s); }

/* Logo */
.ayu-h-logo { justify-self: start; line-height: 0; }
html body .ayu-header .ayu-h-logo .eltd-mobile-logo-wrapper,
html body .ayu-header .ayu-h-logo a { display: inline-block !important; height: auto !important; line-height: 0 !important; }
html body .ayu-header .ayu-h-logo img {
	display: block;
	width: auto !important;
	height: 80px !important;
	max-height: none !important;
	transition: height .35s cubic-bezier(.16, 1, .3, 1);
}
html body .ayu-header.is-scrolled .ayu-h-logo img { height: 46px !important; }
html body .ayu-header .ayu-h-logo-text { color: var(--ayu-h-ink) !important; font-size: 22px !important; letter-spacing: .12em !important; text-decoration: none !important; text-transform: uppercase !important; }

/* ---------- Desktop menu ---------- */
.ayu-h-nav { justify-self: center; }
html body .ayu-header .ayu-h-menu {
	display: flex;
	align-items: center;
	gap: 6px;
	margin: 0 !important;
	padding: 0 !important;
	list-style: none !important;
}
.ayu-h-menu > li {
	position: relative;
	display: flex;
	align-items: center;
	margin: 0 !important;
	padding: 0 !important;
	list-style: none !important;
}
.ayu-h-menu li::before { display: none !important; }
html body .ayu-header .ayu-h-menu > li > a {
	position: relative;
	display: block;
	padding: 10px 12px !important;
	color: var(--ayu-h-ink) !important;
	font-size: 14.5px !important;
	font-weight: 500 !important;
	letter-spacing: .14em !important;
	line-height: 1.2 !important;
	text-transform: uppercase !important;
	text-decoration: none !important;
	white-space: nowrap;
	transition: color .25s ease;
}
.ayu-h-menu > li > a::after {
	content: "";
	position: absolute;
	left: 12px;
	right: 12px;
	bottom: 4px;
	height: 1px;
	background: var(--ayu-h-gold);
	transform: scaleX(0);
	transition: transform .35s cubic-bezier(.16, 1, .3, 1);
}
.ayu-h-menu > li:hover > a::after,
.ayu-h-menu > li.is-open > a::after,
.ayu-h-menu > li > a:focus-visible::after,
.ayu-h-menu > li.current-menu-item > a::after,
.ayu-h-menu > li.current-menu-ancestor > a::after { transform: scaleX(1); }
html body .ayu-header .ayu-h-menu > li:hover > a,
html body .ayu-header .ayu-h-menu > li.is-open > a { color: var(--ayu-h-gold) !important; }
.ayu-h-menu > .menu-item-has-children > a { padding-right: 2px !important; }
.ayu-h-menu > .menu-item-has-children > a::after { right: 2px; }

html body .ayu-header .ayu-drop-toggle {
	display: grid;
	place-items: center;
	width: 22px;
	height: 30px;
	margin: 0 6px 0 0 !important;
	padding: 0 !important;
	border: 0 !important;
	background: none !important;
	color: var(--ayu-h-ink) !important;
	cursor: pointer;
	box-shadow: none !important;
}
.ayu-drop-toggle svg { transition: transform .3s ease; }
.ayu-h-menu > li:hover > .ayu-drop-toggle svg,
.ayu-h-menu > li.is-open > .ayu-drop-toggle svg { transform: rotate(180deg); }

/* Dropdown panel */
html body .ayu-header .ayu-h-menu .sub-menu {
	position: absolute;
	top: 100%;
	left: 50%;
	z-index: 5;
	min-width: 240px;
	margin: 0 !important;
	padding: 12px 0 !important;
	list-style: none !important;
	background: #fff;
	border-top: 2px solid var(--ayu-h-gold);
	box-shadow: 0 20px 45px rgba(22, 19, 16, .12);
	opacity: 0;
	visibility: hidden;
	transform: translate(-50%, 10px);
	transition: opacity .25s ease, transform .3s cubic-bezier(.16, 1, .3, 1), visibility 0s .3s;
}
.ayu-h-menu > li > .sub-menu::before { /* hover bridge */
	content: "";
	position: absolute;
	left: 0;
	right: 0;
	bottom: 100%;
	height: 22px;
}
html body .ayu-header .ayu-h-menu > li:hover > .sub-menu,
html body .ayu-header .ayu-h-menu > li.is-open > .sub-menu,
html body .ayu-header .ayu-h-menu > li:focus-within > .sub-menu {
	opacity: 1;
	visibility: visible;
	transform: translate(-50%, 18px);
	transition: opacity .25s ease, transform .3s cubic-bezier(.16, 1, .3, 1), visibility 0s;
}
.ayu-h-menu .sub-menu li { margin: 0 !important; padding: 0 !important; list-style: none !important; }
html body .ayu-header .ayu-h-menu .sub-menu a {
	display: block;
	padding: 9px 26px !important;
	color: var(--ayu-h-ink) !important;
	font-size: 14px !important;
	font-weight: 400 !important;
	letter-spacing: .1em !important;
	line-height: 1.35 !important;
	text-transform: uppercase !important;
	text-decoration: none !important;
	white-space: nowrap;
	transition: color .2s ease, background-color .2s ease, padding .25s ease;
}
html body .ayu-header .ayu-h-menu .sub-menu a:hover,
html body .ayu-header .ayu-h-menu .sub-menu a:focus-visible {
	color: var(--ayu-h-gold) !important;
	background: #faf7f1;
	padding-left: 32px !important;
}
html body .ayu-header .ayu-h-menu .sub-menu .current-menu-item > a { color: var(--ayu-h-gold) !important; }

/* ---------- Icons ---------- */
.ayu-h-actions { justify-self: end; display: flex; align-items: center; gap: 4px; }
html body .ayu-header .ayu-h-btn,
html body .ayu-drawer .ayu-h-btn {
	position: relative;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 44px;
	height: 44px;
	margin: 0 !important;
	padding: 0 !important;
	border: 0 !important;
	border-radius: 50% !important;
	background: none !important;
	box-shadow: none !important;
	color: var(--ayu-h-ink) !important;
	cursor: pointer;
	text-decoration: none !important;
	transition: color .25s ease, background-color .25s ease;
	-webkit-tap-highlight-color: transparent;
}
html body .ayu-header .ayu-h-btn:hover,
html body .ayu-header .ayu-h-btn[aria-expanded="true"] { color: var(--ayu-h-gold) !important; background: #f6f2ea !important; }
.ayu-header a:focus-visible,
.ayu-header button:focus-visible,
.ayu-drawer a:focus-visible,
.ayu-drawer button:focus-visible { outline: 2px solid var(--ayu-h-gold); outline-offset: 2px; }

html body .ayu-header .ayu-cart-count {
	position: absolute;
	top: 4px;
	right: 2px;
	min-width: 18px;
	height: 18px;
	padding: 0 5px !important;
	border-radius: 9px;
	background: var(--ayu-h-gold) !important;
	color: #fff !important;
	font: 600 11px/18px system-ui, -apple-system, "Segoe UI", sans-serif !important;
	letter-spacing: 0 !important;
	text-align: center;
}
.ayu-cart-count[hidden] { display: none !important; }

/* Burger (mobile only) */
.ayu-burger { display: none !important; }
.ayu-burger-lines { display: grid; gap: 5px; width: 20px; }
html body .ayu-header .ayu-burger-lines { color: inherit !important; }
html body .ayu-header .ayu-burger-lines i { display: block; height: 1.5px; background: var(--ayu-h-ink) !important; border-radius: 1px; }

/* ---------- Search panel ---------- */
.ayu-search {
	border-top: 1px solid var(--ayu-h-line);
	background: #fff;
	animation: ayuSearchIn .35s cubic-bezier(.16, 1, .3, 1);
}
.ayu-search[hidden] { display: none; }
.ayu-search-form {
	display: flex;
	align-items: center;
	gap: 14px;
	max-width: 980px;
	margin: 0 auto;
	padding: 18px 40px;
	color: var(--ayu-h-muted);
}
html body .ayu-header .ayu-search input[type="search"] {
	flex: 1;
	min-width: 0;
	height: 52px;
	margin: 0 !important;
	padding: 0 4px !important;
	border: 0 !important;
	border-bottom: 1px solid var(--ayu-h-line) !important;
	border-radius: 0 !important;
	background: transparent !important;
	box-shadow: none !important;
	color: var(--ayu-h-ink) !important;
	font-size: 22px !important;
	outline: none;
}
html body .ayu-header .ayu-search input[type="search"]:focus { border-bottom-color: var(--ayu-h-gold) !important; }
html body .ayu-header .ayu-search button[type="submit"] {
	height: 46px;
	margin: 0 !important;
	padding: 0 26px !important;
	border: 1px solid var(--ayu-h-ink) !important;
	border-radius: 0 !important;
	background: var(--ayu-h-ink) !important;
	color: #fff !important;
	font-size: 13px !important;
	letter-spacing: .18em !important;
	text-transform: uppercase !important;
	cursor: pointer;
	transition: background-color .25s, border-color .25s;
}
html body .ayu-header .ayu-search button[type="submit"]:hover { background: var(--ayu-h-gold) !important; border-color: var(--ayu-h-gold) !important; }
html body .ayu-header .ayu-search-close { display: grid; place-items: center; width: 40px; height: 40px; padding: 0 !important; border: 0 !important; background: none !important; color: var(--ayu-h-muted) !important; cursor: pointer; }
@keyframes ayuSearchIn { from { opacity: 0; transform: translateY(-8px); } to { opacity: 1; transform: none; } }

/* ---------- Drawer (mobile) ---------- */
.ayu-overlay, .ayu-drawer { display: none; }

/* Tighter spacing on small laptops */
@media only screen and (max-width: 1240px) {
	.ayu-h-bar { padding: 0 24px; gap: 12px; }
	html body .ayu-header .ayu-h-menu > li > a { padding: 10px 9px !important; font-size: 13.5px !important; letter-spacing: .1em !important; }
	.ayu-h-menu > li > a::after { left: 9px; right: 9px; }
}

/* ==========================================================================
   Tablet & mobile (≤1024px): burger | logo | icons
   ========================================================================== */
@media only screen and (max-width: 1024px) {
	.ayu-h-spacer { height: var(--ayu-h-m); }
	.ayu-h-bar { height: var(--ayu-h-m); padding: 0 12px; gap: 8px; }
	.ayu-header.is-scrolled .ayu-h-bar { height: var(--ayu-h-ms); }
	.ayu-h-nav { display: none; }
	.ayu-burger { display: inline-flex !important; justify-self: start; }
	.ayu-h-logo { justify-self: center; }
	html body .ayu-header .ayu-h-logo img { height: 48px !important; }
	html body .ayu-header.is-scrolled .ayu-h-logo img { height: 42px !important; }
	.ayu-h-actions { gap: 0; }
	.ayu-search-form { padding: 12px 16px; gap: 10px; }
	.ayu-search-form > svg { display: none; }
	html body .ayu-header .ayu-search input[type="search"] { height: 46px; font-size: 18px !important; } /* ≥16px stops iOS zoom */
	html body .ayu-header .ayu-search button[type="submit"] { padding: 0 16px !important; }
	html body .ayu-header .ayu-search-close { display: none; }

	.ayu-overlay {
		display: block;
		position: fixed;
		inset: 0;
		z-index: 9991;
		background: rgba(22, 19, 16, .45);
		opacity: 0;
		transition: opacity .3s;
	}
	.ayu-overlay[hidden] { display: none; }
	.ayu-overlay.is-open { opacity: 1; }

	.ayu-drawer {
		display: block;
		position: fixed;
		top: 0;
		bottom: 0;
		left: 0;
		z-index: 9992;
		width: min(86vw, 380px);
		overflow-y: auto;
		background: #fff;
		transform: translateX(-100%);
		visibility: hidden;
		transition: transform .35s cubic-bezier(.16, 1, .3, 1), visibility 0s .35s;
	}
	.admin-bar .ayu-drawer { top: var(--ayu-h-top); }
	.ayu-drawer.is-open { transform: none; visibility: visible; transition: transform .35s cubic-bezier(.16, 1, .3, 1); }

	.ayu-drawer-head {
		display: flex;
		align-items: center;
		justify-content: space-between;
		height: var(--ayu-h-m);
		padding: 0 12px 0 24px;
		border-bottom: 1px solid var(--ayu-h-line);
	}
	html body .ayu-drawer .ayu-drawer-title { color: var(--ayu-h-gold) !important; font-size: 13px !important; letter-spacing: .3em !important; text-transform: uppercase !important; }

	.ayu-menu, .ayu-menu ul { margin: 0 !important; padding: 0 !important; list-style: none !important; }
	.ayu-menu li { position: relative; margin: 0 !important; padding: 0 !important; border-bottom: 1px solid var(--ayu-h-line); list-style: none !important; }
	.ayu-menu li::before { display: none !important; }
	.ayu-menu .sub-menu li:last-child { border-bottom: 0; }
	html body .ayu-drawer .ayu-menu a {
		display: block;
		padding: 16px 60px 16px 24px !important;
		color: var(--ayu-h-ink) !important;
		font-size: 16px !important;
		letter-spacing: .12em !important;
		line-height: 1.3 !important;
		text-transform: uppercase !important;
		text-decoration: none !important;
	}
	html body .ayu-drawer .ayu-menu .current-menu-item > a { color: var(--ayu-h-gold) !important; }
	.ayu-menu .sub-menu { display: none; background: #faf7f1; border-top: 1px solid var(--ayu-h-line); }
	html body .ayu-drawer .ayu-menu .sub-menu a { padding-left: 40px !important; font-size: 15px !important; }
	.ayu-menu li.is-open > .sub-menu { display: block; }
	html body .ayu-drawer .ayu-sub-toggle {
		position: absolute;
		top: 0;
		right: 0;
		width: 56px;
		height: 53px;
		margin: 0 !important;
		padding: 0 !important;
		border: 0 !important;
		border-left: 1px solid var(--ayu-h-line) !important;
		background: none !important;
		cursor: pointer;
	}
	.ayu-sub-toggle::before { content: ""; position: absolute; top: 20px; left: 24px; width: 8px; height: 8px; border: solid var(--ayu-h-ink); border-width: 0 1.5px 1.5px 0; transform: rotate(45deg); transition: transform .25s; }
	li.is-open > .ayu-sub-toggle::before { transform: rotate(-135deg); top: 24px; }

	body.ayu-locked { overflow: hidden; }
}

@media (prefers-reduced-motion: reduce) {
	.ayu-header, .ayu-header *, .ayu-drawer, .ayu-overlay { transition: none !important; animation: none !important; }
}
