/* HeaderX Mobile Layer (class-driven by .hx-mobile-view) */

.hx.hx-mobile-view {
	touch-action: manipulation;
}

/* Keep mobile header compact and predictable */
.hx.hx-mobile-view .hx-bar {
	padding: 10px 14px;
	min-height: var(--hx-collapsed-height, 64px);
	align-items: stretch;
}

/* Remove side info completely on mobile */
.hx.hx-mobile-view .hx-side-block,
.hx.hx-mobile-view .hx-mancini-side,
.hx.hx-mobile-view .hx-side-desc {
	display: none !important;
}

/* 50/50 split in mobile header */
.hx.hx-mobile-view .hx-bar-left,
.hx.hx-mobile-view .hx-bar-right {
	width: 50%;
	max-width: 50%;
	min-width: 0;
}

.hx.hx-mobile-view .hx-bar-left {
	justify-content: center;
	align-items: flex-start;
}

.hx.hx-mobile-view .hx-label-row {
	width: 100%;
	align-items: center;
	gap: 8px;
}

.hx.hx-mobile-view .hx-menu-trigger {
	margin-left: 0;
	font-size: 14px;
	letter-spacing: 0.08em;
}

/* Top logo + bottom logo on the right side */
.hx.hx-mobile-view .hx-bar-right {
	justify-content: flex-end;
}

.hx.hx-mobile-view .hx-logos {
	width: 100%;
	height: 100%;
	justify-content: space-between;
	align-items: flex-end;
}

.hx.hx-mobile-view .hx-logo {
	max-width: 100%;
	line-height: 1;
}

.hx.hx-mobile-view .hx-logo-1,
.hx.hx-mobile-view .hx-logo-2 {
	text-align: right;
	max-width: 100%;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.hx.hx-mobile-view .hx-logo-1 {
	font-size: clamp(1rem, 4.6vw, 1.45rem);
}

.hx.hx-mobile-view .hx-logo-2 {
	font-size: clamp(0.56rem, 2.2vw, 0.72rem);
	letter-spacing: 0.08em;
}

.hx.hx-mobile-view .hx-logo-img {
	max-height: 22px;
	width: auto;
	height: auto;
}

/* Mobile panel: single-column, no visual clutter */
.hx.hx-mobile-view.hx-open .hx-panel.hx-mancini,
.hx.hx-mobile-view .hx-panel.hx-mancini.hx-closing {
	padding: 16px;
	overflow-y: auto;
}

.hx.hx-mobile-view .hx-mancini-inner {
	display: flex;
	flex-direction: column;
	min-height: calc(100dvh - 32px);
	gap: 1rem;
}

.hx.hx-mobile-view .hx-mancini-left,
.hx.hx-mobile-view .hx-mancini-right {
	grid-column: auto;
	grid-row: auto;
	width: 100%;
}

.hx.hx-mobile-view .hx-mancini-left {
	order: 1;
	gap: 0.75rem;
}

.hx.hx-mobile-view .hx-mancini-right {
	order: 2;
	align-items: flex-start;
	justify-content: flex-start;
	gap: 1.2rem;
}

/* In mobile panel, keep only essential navigation flow */
.hx.hx-mobile-view .hx-mancini-preview,
.hx.hx-mobile-view .hx-mancini-footer,
.hx.hx-mobile-view .hx-panel-logo-1,
.hx.hx-mobile-view .hx-panel-logo-2 {
	display: none !important;
}

.hx.hx-mobile-view .hx-mancini .hx-close {
	font-size: 0.82rem;
}

.hx.hx-mobile-view .hx-mancini-nav {
	align-self: stretch;
	width: 100%;
	margin: 0;
}

.hx.hx-mobile-view .hx-mancini-nav .hx-nav-list {
	gap: 0.35rem;
}

.hx.hx-mobile-view .hx-mancini-nav .hx-nav-link {
	font-size: clamp(1rem, 5vw, 1.35rem);
	line-height: 1.28;
	letter-spacing: 0.06em;
	white-space: normal;
}

.hx.hx-mobile-view .hx-mancini-nav .hx-submenu {
	padding-left: 0.65rem;
	gap: 0.2rem;
}

.hx.hx-mobile-view .hx-mancini-nav .hx-submenu-link {
	font-size: 0.9rem;
	line-height: 1.35;
}