/**
 * Site Header — fixed wrapper, optional banner, main bar, slide-out search.
 * Banner: #F1EDE8, 51px. Main bar: #FEFBF7, border #E9E5E0. Button items: #000 / #fff.
 */

/* Reserve space for fixed header (JS sets --header-height) */
body {
	padding-top: var(--header-height, 80px);
}

/* Fixed header wrapper */
.site-header {
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	z-index: 1000;
	background: #FEFBF7;
}

/* Optional banner bar */
.header-banner {
	background: #F1EDE8;
	height: 51px;
	display: flex;
	align-items: center;
	justify-content: center;
	text-align: center;
	padding: 0 20px;
	font-family: 'IBM Plex Mono', monospace;
	color: #000;
	font-size: 13px;
	line-height: 20px;
}
.header-banner p {
	font-family: 'IBM Plex Mono', monospace;
	color: #000;
	font-size: 13px;
	line-height: 20px;
	margin:0;
	letter-spacing:0;
}
.header-banner p strong {
	font-weight:50;
	color: #000;
}
.header-banner a {
	color: #000;
	text-decoration: underline;
	margin-left: 0px;
	transition: all 0.5s;
}

.header-banner a:hover {
	opacity: 0.5;
}

/* Main bar */
.header-main {
	background: #FEFBF7;
	border-bottom: 3px solid #E9E5E0;
}

.header-main-inner {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 24px;
	max-width: 1193px;
	margin: 0 auto;
	padding: 20px 0px 19px;
	width: 98%;
}

/* Logo */
.header-logo {
	display: block;
	line-height: 0;
	flex-shrink: 0;
	width: 333px;
	border-right: 3px solid #E9E5E0;
	padding: 4px 44px 4px 0;
}

.header-logo img {
	display: block;
	height: auto;
	max-height: 48px;
	width: auto;
	object-fit: contain;
}

/* Primary nav */
.header-nav {
	flex: 1;
	display: flex;
	justify-content: flex-end;
}

.primary-menu {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	gap: 8px 24px;
	align-items: center;
	justify-content: space-between;
	width: 97%;
}

.primary-menu li {
	position: relative;
	margin: 0;
	padding: 0;
}

.primary-menu>li>a {
	display: inline-block;
	padding: 8px 0;
	color: #504D49;
	text-decoration: none;
	font-size: 13px;
	text-transform: uppercase;
	transition: opacity 0.2s ease;
	letter-spacing: 0.13rem;
	font-weight: 600;
	font-family: 'sofia-pro';
}

.primary-menu>li>a:hover {
	opacity: 0.7;
}

/* Menu item with class "button" (set in WP menu CSS class) */
.primary-menu li.button>a {
	background: #000000;
	color: #fff;
	padding: 5px 18px 7px;
	border-radius: 0;
	letter-spacing: 0.12rem;
	font-family: 'sofia-pro';
	margin-left: 50px;
}

.primary-menu li.button>a:hover {
	opacity: 0.9;
	color: #fff;
	background: #402103;
}

/* Submenu indicator (dropdown arrow SVG) */
.primary-menu .menu-item-has-children>a::after {
	content: '';
	display: inline-block;
	width: 7px;
	height: 4px;
	margin-left: 6px;
	vertical-align: middle;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='6.627' height='3.777' viewBox='0 0 6.627 3.777'%3E%3Cpath d='M608.75,44.523V42.954l3.313,2.209,3.314-2.209v1.569l-3.314,2.208Z' transform='translate(-608.75 -42.954)' fill='%23504d49'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-position: center;
	background-size: contain;
	transition: transform 0.2s ease;
}

.primary-menu .menu-item-has-children:hover>a::after,
.primary-menu .menu-item-has-children:focus-within>a::after {
	transform: rotate(180deg);
}

/* Dropdowns: fitted to content width */
.primary-menu .menu-item-has-children {
	position: relative;
}

.primary-menu .sub-menu {
	position: absolute;
	top: 100%;
	left: 0;
	right: 0;
	margin: 0 auto;
	list-style: none;
	padding: 25px 20px;
	box-shadow: 0 4px 12px rgba(0, 0, 0, 0.12);
	opacity: 0;
	visibility: hidden;
	transform: translateY(-4px);
	transition: opacity 0.2s ease, transform 0.2s ease, visibility 0.2s;
	z-index: 100;
	border: 2px solid #E3DFDA;
	background: #fffbf8;
	width: 584px;
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 0px;

}

#menu-item-12362 .sub-menu, #menu-item-22189 .sub-menu {
	display: block;
}

.primary-menu .menu-item-has-children:hover>.sub-menu,
.primary-menu .menu-item-has-children:focus-within>.sub-menu {
	opacity: 1;
	visibility: visible;
	transform: translateY(0);
}

.primary-menu .sub-menu li {
	margin: 0;
	padding: 0;
}

.primary-menu .sub-menu a {
	display: block;
	padding: 10px 16px;
	text-decoration: none;
	font-size: 14px;
	white-space: nowrap;
	transition: background 0.2s ease;
	letter-spacing: 0.13rem;
	font-weight: 600;
	font-family: 'sofia-pro';
	text-transform: uppercase;
	color: #504D49;
	padding: 2px;
}

.primary-menu .sub-menu .underline {
	grid-column: 1 / -1;
	/* spans all columns */
}

.primary-menu .sub-menu .underline a {
	background-image: linear-gradient(to right, #f1ede8 0%, #f1ede8 100%);
	background-repeat: repeat-x;
	background-position: 0 103%;
	background-size: 105% 11px;
	transition: all 0.2s linear 0s;
	-moz-transition: all 0.2s linear 0s;
	-webkit-transition: all 0.2s linear 0s;
	color: #252421 !important;
	letter-spacing: 0.125rem;
	line-height: 1.87;
	padding: 0 7px;
	width: fit-content;
	margin: 20px 0 0 -8px;
}

.primary-menu .sub-menu .underline {
	width: 100%;
}

/* Nested submenus (if any) */
.primary-menu .sub-menu .sub-menu {
	top: 0;
	left: 100%;
	margin-left: 4px;
}

/* Block area / description inside submenus (legacy support) */
.primary-menu .sub-menu .block-area,
.primary-menu .sub-menu .menu-block-area {
	padding: 12px 16px;
	border-top: 1px solid #E9E5E0;
	margin-top: 4px;
	white-space: normal;
}

.primary-menu .sub-menu .menu-description {
	font-size: 12px;
	color: #6F6B66;
	margin-top: 2px;
}

/* Search toggle button */
.search-toggle {
	background: none;
	border: none;
	color: #5A5653;
	cursor: pointer;
	padding: 8px;
	display: flex;
	align-items: center;
	justify-content: center;
	transition: opacity 0.2s ease;
	flex-shrink: 0;
	border-left: 3px solid #E9E5E0;
	height: 100%;
	display: block;
	padding: 11px 0 11px 32px;
	margin-left: 11px;
}

.search-toggle:hover {
	opacity: 0.7;
	color: #5A5653 !important;
	background: transparent !important;
}

.search-toggle__icon {
	display: block;
	pointer-events: none;
}

/* Slide-out search panel */
.search-dropdown {
	position: fixed;
	top: 0;
	right: 0;
	bottom: 0;
	width: 100%;
	max-width: 400px;
	background: #FEFBF7;
	box-shadow: -4px 0 20px rgba(0, 0, 0, 0.1);
	z-index: 1001;
	padding: 24px;
	transform: translateX(100%);
	transition: transform 0.3s ease, visibility 0.3s;
	visibility: hidden;
	overflow-y: auto;
}

.search-dropdown.active {
	transform: translateX(0);
	visibility: visible;
}

.search-dropdown .searchform {
	display: flex;
	flex-direction: column;
	gap: 12px;
}

.search-dropdown label {
	color: #504D49;
	text-decoration: none;
	font-size: 13px;
	text-transform: uppercase;
	transition: opacity 0.2s ease;
	letter-spacing: 0.13rem;
	font-weight: 600;
	font-family: 'sofia-pro';
}

.search-dropdown input[type="search"] {
	width: 100%;
	padding: 12px 16px;
	border: 1px solid #E9E5E0;
	background: #fff;
	font-size: 16px;
}

.search-dropdown input[type="search"]:focus {
	outline: 2px solid #000;
	outline-offset: 2px;
}

.header-menu-toggle {
	display: none;
	background: none;
	border: none;
	color: #5A5653;
	cursor: pointer;
	padding: 11px 0 11px 24px;
	margin-left: 16px;
	border-left: 3px solid #E9E5E0;
	flex-shrink: 0;
}

.header-menu-toggle__bar {
	display: block;
	width: 18px;
	height: 2px;
	background-color: currentColor;
	transition: transform 0.25s ease, opacity 0.25s ease;
}

.header-menu-toggle__bar + .header-menu-toggle__bar {
	margin-top: 4px;
}

.header-menu-toggle.is-open .header-menu-toggle__bar:nth-child(1) {
	transform: translateY(6px) rotate(45deg);
}

.header-menu-toggle.is-open .header-menu-toggle__bar:nth-child(2) {
	opacity: 0;
}

.header-menu-toggle.is-open .header-menu-toggle__bar:nth-child(3) {
	transform: translateY(-6px) rotate(-45deg);
}

.mobile-nav-panel {
	position: fixed;
	top: var(--header-height, 0);
	right: 0;
	bottom: 0;
	width: 100%;
	max-width: 360px;
	background: #FEFBF7;
	box-shadow: -4px 0 20px rgba(0, 0, 0, 0.1);
	z-index: 1002;
	transform: translateX(100%);
	transition: transform 0.3s ease, visibility 0.3s;
	visibility: hidden;
	overflow-y: auto;
}

.mobile-nav-panel__inner {
	padding: 24px 24px 32px;
}

.mobile-nav-panel.active {
	transform: translateX(0);
	visibility: visible;
}

.mobile-nav-panel__searchform {
	display: flex;
	flex-direction: column;
	gap: 12px;
	margin-bottom: 24px;
}

.mobile-nav-panel__searchform label {
	color: #504D49;
	font-size: 0px;
	height:0px;
}

.mobile-nav-panel__searchform input[type="search"] {
	width: 100%;
	padding: 12px 16px 12px 44px;
	border: 1px solid #E9E5E0;
	background: #fff;
	font-size: 16px;
	outline:none;
}

#mobile-nav-search-input {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 24 24' fill='none' stroke='%235A5653' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='11' cy='11' r='8'/%3E%3Cpath d='m21 21-4.35-4.35'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: 1px center;
    background-size: 20px 20px;
    border: none;
    background-color: transparent;
    border-bottom: 3px solid #E9E5E0;
    padding: 10px 0 10px 30px;
    font-size: 14px;
    font-family: 'IBM Plex Sans';
}

.mobile-nav {
	margin-top: 8px;
}

.mobile-menu {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: 2px;
}

.mobile-menu > li > a {
	display: block;
	padding: 8px 0;
	color: #504D49;
	text-decoration: none;
	font-size: 13px;
	text-transform: uppercase;
	letter-spacing: 0.13rem;
	font-weight: 600;
	font-family: 'sofia-pro';
}

.mobile-menu > li > a:hover {
	opacity: 0.7;
}
.mobile-menu li .sub-menu a {
    color: black;
    font-size: 14px;
    font-family: 'IBM Plex Sans';
}
.mobile-menu li {
margin-bottom:20px;
}
.mobile-menu li .sub-menu li {
	margin-bottom:0;
}
body.mobile-nav-open .search-backdrop {
	opacity: 1;
	visibility: visible;
	pointer-events: auto;
}

body.mobile-nav-open {
	overflow: hidden;
}

/* Backdrop when search is open */
.search-backdrop {
	position: fixed;
	top: var(--header-height, 0);
	left: 0;
	right: 0;
	bottom: 0;
	background: rgba(0, 0, 0, 0.3);
	z-index: 900;
	opacity: 0;
	visibility: hidden;
	transition: opacity 0.3s ease, visibility 0.3s;
	pointer-events: none;
}

body.search-panel-open .search-backdrop {
	opacity: 1;
	visibility: visible;
	pointer-events: auto;
}

/* Responsive */
@media (max-width: 1220px) {
	.primary-menu li.button>a {
		margin-left: 0;
	}

	.primary-menu {
		gap: 8px 14px;
	}
}

@media (max-width:1080px) {
	.search-toggle {
		padding: 11px 0 11px 10px;
		margin-left: -6px;
	}

	.header-logo {
		padding: 4px 15px 4px 0;
		width: 300px;
	}
}

@media (max-width: 1024px) {
	.header-logo {
		border:none;
	}
	.header-nav {
		display: none;
	}

	.search-toggle {
		display: none;
	}

	.header-menu-toggle {
		display: block;
		border: none;
		margin: 0;
	}
	.header-menu-toggle:hover {
		background:transparent!important;
		color:currentColor;
	}
	.header-menu-toggle:hover .header-menu-toggle__bar{
		    background-color: currentColor;
	}
}
@media (max-width: 580px) {
	.header-banner p strong {
		display:block;
	}
	.header-banner p {
	    line-height: 18px;
	    font-size: 12px;
	}
	.header-main-inner {
		width:95%;
	}
	.header-logo {
	    padding: 0;
	    width: 225px;
	}
	.header-main-inner {
		padding: 10px 0;
	}
	.mobile-nav-panel {
		max-width:100%;
	}
}