/* Juanito — Menú y buscador móvil · v1.0.0
   Solo ≤767px y solo cuando el JS marca html.jmb-on (si el JS falla, el menú viejo sigue funcionando). */

@media (max-width: 767.98px) {

/* ── apagar el menú viejo de Elementor solo con JS vivo ───────────── */
html.jmb-on body .elementor-element-678c9fa0.elementor-element-678c9fa0.elementor-element-678c9fa0 .elementor-element-8b3a646 .elementor-nav-menu__container,
html.jmb-on body .elementor-element-678c9fa0.elementor-element-678c9fa0.elementor-element-678c9fa0 .elementor-element-8b3a646 .elementor-nav-menu--dropdown {
  display: none !important;
}
/* el glifo viejo (::before de 22px) y sus svg se esconden; entra el ☰ de 3 líneas */
html.jmb-on body .elementor-element-678c9fa0.elementor-element-678c9fa0.elementor-element-678c9fa0 .elementor-element-8b3a646.elementor-element-8b3a646.elementor-element-8b3a646 .elementor-menu-toggle::before,
html.jmb-on body .elementor-element-678c9fa0.elementor-element-678c9fa0.elementor-element-678c9fa0 .elementor-element-8b3a646.elementor-element-8b3a646.elementor-element-8b3a646 .elementor-menu-toggle::after {
  content: none !important;
  display: none !important;
}
html.jmb-on body .elementor-element-678c9fa0 .elementor-element-8b3a646 .elementor-menu-toggle > svg {
  display: none !important;
}

/* ── el ☰ que se dobla en ✕, línea por línea ──────────────────────── */
.jmb-brg { width: 22px; height: 22px; position: relative; display: block; pointer-events: none; }
.jmb-brg i {
  position: absolute; left: 1px; right: 1px; height: 1.5px;
  background: #161513; border-radius: 2px;
  transition: top .42s cubic-bezier(.22,1,.36,1), transform .42s cubic-bezier(.22,1,.36,1), opacity .3s ease;
}
.jmb-brg i:nth-child(1) { top: 5px; }
.jmb-brg i:nth-child(2) { top: 10.3px; }
.jmb-brg i:nth-child(3) { top: 15.6px; }
html.jmb-menu-open .jmb-brg i:nth-child(1) { top: 10.3px; transform: rotate(45deg); }
html.jmb-menu-open .jmb-brg i:nth-child(2) { opacity: 0; transform: scaleX(.3); }
html.jmb-menu-open .jmb-brg i:nth-child(3) { top: 10.3px; transform: rotate(-45deg); }

/* ── la lupa que se funde a ✕ ─────────────────────────────────────── */
.jmb-dual { width: 22px; height: 22px; position: relative; display: block; pointer-events: none; }
.jmb-dual > span {
  position: absolute; inset: 0; display: block;
  transition: opacity .32s ease, transform .42s cubic-bezier(.22,1,.36,1);
}
.jmb-dual svg { width: 22px; height: 22px; display: block; }
.jmb-dual .jmb-ico-x { opacity: 0; transform: rotate(-60deg) scale(.7); }
html.jmb-bus-open .jmb-dual .jmb-ico-lupa { opacity: 0; transform: rotate(45deg) scale(.7); }
html.jmb-bus-open .jmb-dual .jmb-ico-x { opacity: 1; transform: none; }

/* ── velo y paneles ───────────────────────────────────────────────── */
html.jmb-lock, html.jmb-lock body { overflow: hidden !important; }

.jmb-velo {
  position: fixed; left: 0; right: 0; bottom: 0; top: var(--jmb-top, 88px);
  background: rgba(22,21,19,.32);
  -webkit-backdrop-filter: blur(4px); backdrop-filter: blur(4px);
  opacity: 0; pointer-events: none; transition: opacity .45s ease;
  z-index: 99990;
}
html.jmb-menu-open .jmb-velo, html.jmb-bus-open .jmb-velo { opacity: 1; pointer-events: auto; }

.jmb-capa {
  position: fixed; left: 0; right: 0; top: var(--jmb-top, 88px);
  background: #fbfaf8; color: #161513;
  font-family: Poppins, -apple-system, "Segoe UI", sans-serif;
  display: flex; flex-direction: column;
  opacity: 0; transform: translateY(-10px); pointer-events: none;
  transition: opacity .45s ease, transform .5s cubic-bezier(.22,1,.36,1);
  z-index: 99991;
}
.jmb-capa.jmb-abierta { opacity: 1; transform: none; pointer-events: auto; }
.jmb-panel { bottom: 0; }
.jmb-buscar { max-height: 76vh; border-radius: 0 0 18px 18px; box-shadow: 0 24px 48px rgba(22,21,19,.10); }

@keyframes jmbSube { from { opacity: 0; transform: translateY(7px); } to { opacity: 1; transform: none; } }
.jmb-capa.jmb-abierta .jmb-anim { animation: jmbSube .5s cubic-bezier(.22,1,.36,1) both; }

/* ── fila de cuenta: la 01 final ──────────────────────────────────── */
.jmb-cuenta {
  display: flex; align-items: center; justify-content: space-between;
  padding: 16px 18px; margin: 2px 16px 0;
  border-bottom: 1px solid #eceae6; flex: none;
}
.jmb-cuenta > a {
  font-family: Oswald, sans-serif; font-size: 11.5px; letter-spacing: 1.6px;
  text-transform: uppercase; color: #161513; text-decoration: none;
}
.jmb-dcha { display: flex; align-items: center; gap: 4px; margin: -8px -8px -8px 0; }
.jmb-idio { display: inline-flex; align-items: center; gap: 7px; font-family: Oswald, sans-serif; font-size: 10px; letter-spacing: 1.2px; }
.jmb-idio a {
  background: none; border: 0; cursor: pointer; padding: 6px 2px;
  font: inherit; letter-spacing: inherit; color: #6b6560; font-weight: 400;
  text-decoration: none; text-transform: uppercase;
  transition: color .35s ease;
}
.jmb-idio a.jmb-on { color: #161513; font-weight: 500; }
.jmb-idio i { font-style: normal; color: #c9c2ba; }
.jmb-lupita {
  width: 36px; height: 36px; border: 0; background: none; border-radius: 9px;
  color: #6b6560; display: inline-flex; align-items: center; justify-content: center;
  cursor: pointer; padding: 0;
}
.jmb-lupita svg { width: 17px; height: 17px; display: block; }

/* ── cuerpo del menú ──────────────────────────────────────────────── */
.jmb-body { flex: 1 1 auto; overflow-y: auto; -webkit-overflow-scrolling: touch; padding: 0 16px 18px; min-height: 0; }
.jmb-sec { border-bottom: 1px solid #eceae6; }
.jmb-sec > button, .jmb-sec > a.jmb-directo {
  width: 100%; display: flex; align-items: center; justify-content: space-between; gap: 10px;
  padding: 16.5px 2px; background: none; border: 0; cursor: pointer; text-align: left;
  text-decoration: none;
}
.jmb-tt { font-family: Poppins, sans-serif; font-size: 17px; color: #161513; font-weight: 300; line-height: 1.2; }
.jmb-mas { width: 20px; height: 20px; position: relative; flex: none; opacity: .8; }
.jmb-mas::before, .jmb-mas::after {
  content: ""; position: absolute; background: #161513;
  transition: transform .32s cubic-bezier(.22,1,.36,1), opacity .3s;
}
.jmb-mas::before { left: 0; top: 9.5px; width: 20px; height: 1px; }
.jmb-mas::after { left: 9.5px; top: 0; width: 1px; height: 20px; }
.jmb-sec.jmb-on .jmb-mas::after { transform: scaleY(0); opacity: 0; }
.jmb-chev { width: 16px; height: 16px; display: inline-flex; color: #6b6560; flex: none; }
.jmb-chev svg { width: 16px; height: 16px; }
.jmb-pan { overflow: hidden; max-height: 0; transition: max-height .4s cubic-bezier(.22,1,.36,1); }
.jmb-pan-in { padding: 2px 0 18px; }
.jmb-card { position: relative; border-radius: 12px; overflow: hidden; margin-bottom: 10px; display: block; text-decoration: none; }
.jmb-card img { width: 100%; height: 130px; object-fit: cover; display: block; }
.jmb-card-ov {
  position: absolute; inset: 0;
  background: linear-gradient(to top, rgba(22,21,19,.6), rgba(22,21,19,.08) 62%);
  display: flex; flex-direction: column; justify-content: flex-end; padding: 13px 14px;
}
.jmb-card h4 { font-family: "Yanone Kaffeesatz", sans-serif; font-weight: 600; font-size: 25px; line-height: .98; color: #fff; margin: 0; }
.jmb-card p { font-family: Oswald, sans-serif; font-size: 10px; letter-spacing: 1.4px; text-transform: uppercase; color: rgba(255,255,255,.85); margin: 4px 0 9px; }
.jmb-card-b {
  align-self: flex-start; background: #fbfaf8; color: #161513;
  font-family: Oswald, sans-serif; font-size: 10px; letter-spacing: 1.4px; text-transform: uppercase;
  padding: 7px 12px; border-radius: 8px;
}
.jmb-sub { list-style: none; margin: 0; padding: 0; }
.jmb-sub a {
  display: flex; justify-content: space-between; align-items: baseline; gap: 10px;
  padding: 9.5px 2px; color: #6b6560; font-size: 14.5px; text-decoration: none;
  border-bottom: 1px solid #eceae6;
}
.jmb-sub li:last-child a { border-bottom: 0; }
.jmb-pr { font-family: Oswald, sans-serif; font-size: 11px; color: #161513; font-variant-numeric: tabular-nums; flex: none; }

/* ── buscador ─────────────────────────────────────────────────────── */
.jmb-busbox { padding: 18px 18px 4px; flex: none; }
.jmb-bus {
  display: flex; align-items: center; gap: 10px;
  background: #fff; border: 1px solid #dad4d3; border-radius: 13px;
  padding: 0 13px; height: 48px; transition: border-color .3s ease;
}
.jmb-bus:focus-within { border-color: #9c5b3b; }
.jmb-bus > svg { width: 18px; height: 18px; color: #6b6560; flex: none; }
.jmb-bus input {
  flex: 1 1 auto; border: 0; outline: 0; background: transparent;
  font-family: Poppins, sans-serif; font-size: 15px; color: #161513; min-width: 0;
}
.jmb-bus input::placeholder { color: #a49e98; }
.jmb-limpia {
  width: 26px; height: 26px; border: 0; background: #efece6; border-radius: 8px;
  color: #6b6560; display: none; align-items: center; justify-content: center;
  cursor: pointer; padding: 0; flex: none;
}
.jmb-limpia svg { width: 13px; height: 13px; }
.jmb-bus.jmb-lleno .jmb-limpia { display: inline-flex; }
.jmb-pista {
  font-family: Oswald, sans-serif; font-size: 9.5px; letter-spacing: 1.3px;
  text-transform: uppercase; color: #a49e98; padding: 8px 20px 6px; flex: none;
}
.jmb-resu { overflow-y: auto; -webkit-overflow-scrolling: touch; padding: 0 18px 18px; min-height: 120px; }
.jmb-rot {
  font-family: Oswald, sans-serif; font-size: 10px; letter-spacing: 1.5px;
  text-transform: uppercase; color: #6b6560; display: block; margin: 14px 0 4px;
}
.jmb-rot:first-child { margin-top: 8px; }
.jmb-nada { font-family: Poppins, sans-serif; font-size: 13px; color: #a49e98; padding: 10px 0; margin: 0; }
.jmb-resu mark { background: none; color: #9c5b3b; font-weight: 500; }
.jmb-mini {
  font-family: Oswald, sans-serif; font-size: 9.5px; letter-spacing: 1.1px;
  text-transform: uppercase; color: #6b6560;
}

@media (prefers-reduced-motion: reduce) {
  .jmb-brg i, .jmb-dual > span, .jmb-velo, .jmb-capa, .jmb-pan, .jmb-mas::before, .jmb-mas::after { transition: none !important; }
  .jmb-capa.jmb-abierta .jmb-anim { animation: none !important; }
}

} /* fin ≤767 */

/* ── BLINDAJE contra el kit del tema (post-362) ───────────────────────
   `.elementor-kit-362 button` pinta TODOS los <button> del sitio:
   background #D84D2B (naranja), Oswald 16px MAYUSCULAS, letter-spacing
   1.2px, color blanco y padding 20px 60px.
   Las reglas de este archivo usan una sola clase (0,1,0) y la del kit
   lleva clase+elemento (0,1,1): el kit ganaba. Por eso la lupita del
   menu y el boton de limpiar salian como rectangulos naranjas de
   120x44, y las filas de acordeon (que son <button>) salian centradas
   en Oswald mayusculas mientras las filas planas (que son <a>) salian
   bien. Se blinda con la tecnica de la casa: reset + clase repetida.
   ⛔ NO bajar la especificidad del kit: lo usa todo el sitio. */
.jmb-capa button, .jmb-panel button {
  background: none !important; color: inherit !important; font: inherit !important;
  text-transform: none !important; letter-spacing: normal !important;
  border: 0 !important; border-radius: 0 !important;
  padding: 0 !important; min-height: 0 !important; box-shadow: none !important;
}
.jmb-capa .jmb-sec > button.jmb-sec-btn,
.jmb-capa .jmb-sec > button {
  display: flex !important; width: 100% !important;
  align-items: center !important; justify-content: space-between !important;
  gap: 10px !important; padding: 16.5px 2px !important;
  color: #161513 !important; text-align: left !important; cursor: pointer !important;
}
.jmb-capa .jmb-lupita.jmb-lupita {
  width: 36px !important; height: 36px !important; border-radius: 9px !important;
  display: inline-flex !important; align-items: center !important; justify-content: center !important;
  color: #6b6560 !important; flex: none !important; cursor: pointer !important;
}
.jmb-capa .jmb-limpia.jmb-limpia {
  width: 26px !important; height: 26px !important; background: #efece6 !important;
  border-radius: 8px !important; align-items: center !important; justify-content: center !important;
  color: #6b6560 !important; flex: none !important; cursor: pointer !important;
}
.jmb-bus.jmb-lleno .jmb-limpia.jmb-limpia { display: inline-flex !important; }
.jmb-bus:not(.jmb-lleno) .jmb-limpia.jmb-limpia { display: none !important; }
/* el titulo de cada fila conserva SU tipografia, no la del kit */
.jmb-capa .jmb-tt {
  font-family: Poppins, sans-serif !important; font-size: 17px !important;
  font-weight: 300 !important; color: #161513 !important;
  text-transform: none !important; letter-spacing: normal !important; line-height: 1.2 !important;
}

/* ── la pastilla de idioma del header no debe flotar sobre el menu ────
   `.jc-idioma-pill` (plugin juanito-idioma) es hija directa de <body>,
   position:absolute y z-index 99998, o sea POR ENCIMA del panel (99991).
   Al abrir el menu quedaba pegada encima de la fila de cuenta, tapando
   el «EN · ES» propio del menu (que es el diseño elegido: texto puro,
   sin caja). Se oculta solo mientras el menu o el buscador esten
   abiertos; en la pagina normal sigue igual que siempre. */
html.jmb-menu-open .jc-idioma-pill,
html.jmb-bus-open .jc-idioma-pill { display: none !important; }
