/* ==========================================================================
   Site header
   ========================================================================== */

.bim-header {
	background: var(--bim-color-surface);
	border-bottom: 1px solid var(--bim-color-border);
	position: sticky;
	top: 0;
	z-index: 100;
}

.bim-header__inner {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: var(--bim-space-md);
	min-height: 84px;
}

/* --- Brand / wordmark ----------------------------------------------------- */
.bim-header__logo img {
	max-height: 60px;
	width: auto;
	display: block;
}

.bim-wordmark {
	display: inline-flex;
	flex-direction: column;
	font-family: var(--bim-font-heading);
	line-height: 1;
	letter-spacing: -0.01em;
}

.bim-wordmark__line1 {
	font-size: 15px;
	font-weight: 500;
	color: var(--bim-color-text-muted);
	text-transform: uppercase;
	letter-spacing: 0.12em;
}

.bim-wordmark__line2 {
	font-size: 28px;
	font-weight: 700;
	color: var(--bim-color-text);
}

.bim-wordmark:hover .bim-wordmark__line2,
.bim-wordmark:focus .bim-wordmark__line2 {
	color: var(--bim-color-accent);
}

.bim-wordmark--sm .bim-wordmark__line2 {
	font-size: 22px;
}

/* --- Nav ------------------------------------------------------------------ */
.bim-nav__toggle {
	display: none; /* shown on mobile below */
	align-items: center;
	gap: 8px;
	background: transparent;
	border: 1px solid var(--bim-color-border);
	border-radius: var(--bim-radius-sm);
	padding: 8px 12px;
	font-family: var(--bim-font-body);
	font-weight: 600;
	font-size: 14px;
	color: var(--bim-color-text);
	cursor: pointer;
	/* Astra's default button styling includes a blue focus/active state
	   (and mobile browsers add their own blue tap-highlight rectangle on
	   top of that) — both get overridden below so tapping this button
	   uses the site's own accent color instead of a stray blue flash. */
	-webkit-tap-highlight-color: transparent;
}

.bim-nav__toggle:hover,
.bim-nav__toggle:focus,
.bim-nav__toggle:active {
	background: var(--bim-color-accent-tint);
	border-color: var(--bim-color-accent);
	color: var(--bim-color-accent);
	outline: none;
}

.bim-nav__toggle:focus-visible {
	outline: 2px solid var(--bim-color-accent);
	outline-offset: 2px;
}

.bim-nav__toggle-icon {
	width: 18px;
	height: 2px;
	background: currentColor;
	position: relative;
}

.bim-nav__toggle-icon::before,
.bim-nav__toggle-icon::after {
	content: '';
	position: absolute;
	left: 0;
	width: 18px;
	height: 2px;
	background: currentColor;
}

.bim-nav__toggle-icon::before { top: -6px; }
.bim-nav__toggle-icon::after  { top: 6px; }

.bim-nav__menu {
	display: flex;
	align-items: center;
	gap: 28px;
	list-style: none;
	margin: 0;
	padding: 0;
}

.bim-nav__menu a {
	font-family: var(--bim-font-body);
	font-weight: 600;
	font-size: 15px;
	color: var(--bim-color-text);
}

.bim-nav__menu a:hover,
.bim-nav__menu a:focus,
.bim-nav__menu .current-menu-item > a {
	color: var(--bim-color-accent);
}

/* Sub-menus (depth 2) */
.bim-nav__menu ul {
	list-style: none;
	margin: 0;
	padding: 0;
}

.bim-nav__menu li {
	position: relative;
}

.bim-nav__menu li ul {
	position: absolute;
	top: 100%;
	left: 0;
	min-width: 200px;
	background: var(--bim-color-surface);
	border: 1px solid var(--bim-color-border);
	border-radius: var(--bim-radius-sm);
	box-shadow: 0 8px 24px rgba(0,0,0,0.08);
	padding: 8px;
	display: none;
}

.bim-nav__menu li:hover > ul,
.bim-nav__menu li:focus-within > ul {
	display: block;
}

.bim-nav__menu li ul li a {
	display: block;
	padding: 8px 10px;
	font-weight: 500;
}

/* --- Mobile ---------------------------------------------------------------- */
@media (max-width: 781px) {

	.bim-header__inner {
		min-height: 68px;
	}

	.bim-nav__toggle {
		display: inline-flex;
	}

	.bim-nav__panel {
		/* !important here is defensive — Astra's own core CSS ships several
		   mobile-menu display rules of its own, and since this custom
		   header markup doesn't use Astra's menu classes there's no
		   guarantee one of those won't collide by accident. This makes
		   sure our open/closed state always wins regardless. */
		display: none !important;
		position: absolute;
		top: 100%;
		left: 0;
		right: 0;
		background: var(--bim-color-surface);
		border-bottom: 1px solid var(--bim-color-border);
		box-shadow: 0 12px 24px rgba(0,0,0,0.08);
	}

	.bim-nav__panel.is-open {
		display: block !important;
	}

	.bim-nav__menu {
		flex-direction: column;
		align-items: stretch;
		gap: 0;
		padding: var(--bim-space-sm) var(--bim-container-pad) var(--bim-space-md);
	}

	.bim-nav__menu a {
		display: block;
		padding: 12px 0;
		border-bottom: 1px solid var(--bim-color-border);
	}

	.bim-nav__menu li ul {
		position: static;
		box-shadow: none;
		border: none;
		padding: 0 0 0 12px;
		display: block;
	}
}