/* ============================================================
   Header móvil (drawer lateral) — solo ≤991px
   Desktop intacto: layout solo dentro del media query.
   Anula el select-menú de grid.css (≤767) y sus reglas de barra/logo.
   ============================================================ */

#mh_toggle { display: none; }
#menu_border_wrapper select { display: none !important; }

@media (max-width: 991px) {

	/* --- barra fija: 56px uniforme + separación del contenido --- */
	.top_bar {
		height: 56px !important;
		box-shadow: 0 2px 10px rgba(0, 0, 0, .3);
	}
	#page_content_wrapper { padding-top: 56px !important; }

	/* --- kenburns_title en móvil: re-mostrar y adaptar (grid.css lo ocultaba ≤767) --- */
	#kenburns_title {
		display: block !important;
		left: 20px !important;
		right: 20px !important;
		bottom: 20px !important;
		padding: 6px 12px !important;
		font-size: 12px !important;
		letter-spacing: 2px;
		line-height: 1.4em;
	}

	/* --- hamburguesa --- */
	#mh_toggle {
		display: block;
		position: absolute;
		right: 6px;
		top: 6px;
		width: 44px;
		height: 44px;
		padding: 0;
		border: 0;
		background: transparent;
		cursor: pointer;
		z-index: 1001;
	}
	#mh_toggle span {
		display: block;
		width: 22px;
		height: 2px;
		margin: 5px auto;
		background: #ffffff;
		transition: transform .3s ease, opacity .3s ease;
	}
	body.mh-open #mh_toggle span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
	body.mh-open #mh_toggle span:nth-child(2) { opacity: 0; }
	body.mh-open #mh_toggle span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }

	/* --- logo limpio, sin tope de 150px --- */
	.logo_wrapper { margin: 0 56px 0 16px !important; padding: 0 !important; }
	.logo_wrapper img { margin: 13px 0 0 0 !important; height: 30px; width: auto; max-width: none !important; max-height: none !important; }

	/* --- fondo oscurecido con desenfoque --- */
	#mh_scrim {
		position: fixed;
		top: 56px; right: 0; bottom: 0; left: 0;
		background: rgba(0, 0, 0, .45);
		opacity: 0;
		visibility: hidden;
		transition: opacity .35s ease, visibility .35s ease;
		z-index: 997;
	}
	body.mh-open #mh_scrim {
		opacity: 1;
		visibility: visible;
		-webkit-backdrop-filter: blur(4px);
		backdrop-filter: blur(4px);
	}

	/* --- panel drawer --- */
	#nav_wrapper,
	body .top_bar #nav_wrapper {
		position: fixed;
		top: 56px; right: 0; bottom: 0;
		left: auto;
		float: none !important;
		width: 78vw;
		max-width: 320px;
		background: #746e66;
		border-radius: 14px 0 0 0;
		box-shadow: -6px 0 24px rgba(0, 0, 0, .4);
		transform: translateX(100%);
		visibility: hidden;
		transition: transform .35s cubic-bezier(.16, 1, .3, 1), visibility .35s ease;
		z-index: 998;
		overflow-y: auto;
		-webkit-overflow-scrolling: touch;
		overscroll-behavior: contain;
	}
	body.mh-open #nav_wrapper,
	body.mh-open .top_bar #nav_wrapper {
		transform: translateX(0);
		visibility: visible;
	}

	/* --- estructura del menú dentro del drawer --- */
	#nav_wrapper .nav_wrapper_inner,
	#nav_wrapper #menu_border_wrapper,
	#nav_wrapper .menu-menu-1-container,
	#main_menu {
		float: none !important;
		width: 100% !important;
		margin: 0;
	}
	#main_menu.nav {
		display: block !important;
		padding: 40px 0 40px 0;
	}
	#main_menu li {
		float: none !important;
		display: block;
	}
	#main_menu li a {
		display: block;
		width: auto !important;
		margin: 0 !important;
		padding: 17px 24px;
		font-size: 13px !important;
		letter-spacing: 3px;
		color: #ffffff !important;
		text-decoration: none;
		border-bottom: 1px solid rgba(255, 255, 255, .12);
		transition: background .2s ease, color .2s ease;
		-webkit-tap-highlight-color: transparent;
	}
	#main_menu li a:active {
		background: rgba(255, 255, 255, .08);
	}
	#main_menu li.current-menu-item > a,
	#main_menu li > a:active {
		color: #f0c482 !important;
	}
	#main_menu li.current-menu-item > a {
		background: rgba(240, 196, 130, .10);
		box-shadow: inset 3px 0 0 #f0c482;
	}

	/* hover solo con ratón real: en táctil/emulación el :hover se queda pegado */
	@media (hover: hover) and (pointer: fine) {
		#main_menu li > a:hover {
			color: #f0c482 !important;
		}
	}

	/* --- acordeón: desplegables --- */
	#main_menu li ul.sub-menu {
		position: static !important;
		display: none !important;
		height: 0 !important;
		overflow: hidden !important;
		width: 100% !important;
		margin: 0 !important;
		padding: 0 !important;
		background: rgba(0, 0, 0, .16);
		border: 0;
		box-shadow: none;
		border-radius: 0;
		-webkit-tap-highlight-color: transparent;
	}
	#main_menu li.mh-open-sub > ul.sub-menu {
		display: block !important;
		height: auto !important;
		overflow: visible !important;
	}
	#main_menu li ul.sub-menu li {
		display: block;
	}
	#main_menu li ul.sub-menu li a {
		padding: 13px 22px 13px 40px;
		font-size: 12px !important;
		letter-spacing: 2px;
		color: rgba(255, 255, 255, .85) !important;
		border-bottom: 1px solid rgba(255, 255, 255, .07);
	}
	#main_menu li ul.sub-menu li:active a {
		background: rgba(255, 255, 255, .06);
	}
	#main_menu li ul.sub-menu li.current-menu-item > a {
		color: #f0c482 !important;
		background: rgba(240, 196, 130, .10);
	}

	/* --- chevron de los padres --- */
	#main_menu li.menu-item-has-children > a {
		position: relative;
		padding-right: 44px;
	}
	#main_menu li.menu-item-has-children > a::after {
		content: '';
		position: absolute;
		right: 22px;
		top: 50%;
		margin-top: -3px;
		border-left: 5px solid transparent;
		border-right: 5px solid transparent;
		border-top: 6px solid rgba(255, 255, 255, .7);
		transition: transform .25s ease;
	}
	#main_menu li.menu-item-has-children.mh-open-sub > a::after {
		transform: rotate(180deg);
	}

	/* --- bloqueo de scroll del fondo --- */
	html.mh-open,
	body.mh-open {
		overflow: hidden;
	}

}
