/* muvon.mx en teléfonos y tablets. El diseño exportado trae estilos en línea pensados para escritorio;
   esta hoja los ajusta (por eso usa !important) y da estilo al menú que arma assets/js/menu.js. */

/* Botón del menú: solo existe cuando menu.js lo agrega, y solo se ve en pantallas angostas */
.mburger{display:none;width:44px;height:44px;border:1px solid #E4E4E7;border-radius:999px;background:#FFFFFF;color:#141415;align-items:center;justify-content:center;cursor:pointer;padding:0;flex:none}
.mburger .ms{font-size:22px}
.mburger:focus-visible{outline:2px solid #7C4DFF;outline-offset:2px}

/* Menús de Aeropuertos y Ciudades: también se abren con un toque (no solo con el ratón) */
.dd.open .menu{opacity:1;visibility:visible;transform:none;transition:opacity .25s ease,transform .35s cubic-bezier(.2,.7,.2,1),visibility 0s}
.dd.open .mi{opacity:1;transform:none}
.dd.open .ddb .ms{transform:rotate(180deg)}
/* Footer: la flecha de cada sección solo existe en el teléfono */
.mc footer .ftitle .ms{display:none;transition:transform .25s ease}
.mc footer .ftitle:focus-visible{outline:2px solid #7C4DFF;outline-offset:2px}

/* Espacio entre el encabezado y el primer texto: igual en todas las páginas y más corto que en el diseño */
.mc nav[style*="padding: 24px 48px 0"]{padding-top:16px !important}
.mc nav[style*="padding: 24px 48px 0"]+section{padding-top:24px !important;align-items:start !important}
.mc section[style*="padding: 96px 48px 64px"]{padding-top:56px !important}
.mc section[style*="padding: 64px 48px 80px"]{padding-top:40px !important;align-items:start !important}
.mc>section:first-of-type[style*="padding: 48px 48px 40px"],.mc>main>section:first-child[style*="padding: 48px 48px 40px"]{padding-top:40px !important}

@media (max-width: 1024px){
  /* Barra: logo a la izquierda, botón del menú a la derecha */
  header.mnav{position:sticky !important;top:0;z-index:40 !important;background:rgba(255,255,255,.96) !important}
  header.mnav>div{padding:12px 16px !important;flex-wrap:wrap !important;gap:0 12px !important;row-gap:0 !important;animation:none !important}
  header.mnav .mburger{display:inline-flex}
  header.mnav nav.nav,header.mnav .hact{display:none !important}

  /* Menú abierto: los enlaces apilados debajo de la barra, a todo lo ancho */
  header.mnav.open{max-height:100dvh;overflow-y:auto;overscroll-behavior:contain}
  header.mnav.open nav.nav{display:flex !important;order:3;flex-basis:100%;flex-direction:column !important;align-items:stretch !important;flex-wrap:nowrap !important;gap:0 !important;padding:8px 0 4px;margin-top:12px;border-top:1px solid #EDEDF0}
  header.mnav.open .ddb{text-align:left}
  header.mnav.open nav.nav>a,header.mnav.open .ddb{display:flex;align-items:center;justify-content:space-between;width:100%;min-height:52px;padding:0 !important;font-size:17px !important;font-weight:600 !important;border-bottom:1px solid #F4F4F5}
  header.mnav.open nav.nav>a::after,header.mnav.open .ddb::after{display:none}
  header.mnav.open .dd{padding:0 !important;margin:0 !important}
  header.mnav.open .menu{position:static !important;min-width:0 !important;width:100%;border:0 !important;border-radius:0 !important;padding:4px 0 10px !important;display:none !important;opacity:1 !important;visibility:visible !important;transform:none !important}
  header.mnav.open .dd.open .menu{display:flex !important}
  header.mnav.open .nav .mi{opacity:1 !important;transform:none !important;padding:10px 4px !important}
  header.mnav.open .nav .mall{padding-top:12px !important}
  header.mnav.open .hact{display:flex !important;order:4;flex-basis:100%;flex-direction:column !important;align-items:stretch !important;gap:10px !important;padding:12px 0 16px}
  header.mnav.open .hact>a,header.mnav.open .hact .btn{width:100%;justify-content:center;height:48px !important}
  header.mnav.open .hact[href]{justify-content:center;padding:0 !important}
  /* Menú abierto: panel de pantalla completa con su propio scroll (la página de atrás queda quieta) */
  header.mnav.open{position:fixed !important;inset:0;height:100vh;height:100dvh;max-height:none !important;overflow-y:auto;-webkit-overflow-scrolling:touch;
    padding-bottom:env(safe-area-inset-bottom);background:#FFFFFF !important;-webkit-backdrop-filter:none !important;backdrop-filter:none !important}
  /* Idioma: un renglón propio al final, ES · EN · FR */
  header.mnav.open .langs,header.mnav.open .langs.hact{display:flex !important;flex-direction:row !important;flex-wrap:nowrap !important;align-items:center !important;justify-content:center !important;
    order:5;flex-basis:100%;height:auto !important;gap:6px !important;padding:16px 0 !important;margin-top:4px;border-top:1px solid #F4F4F5}
  header.mnav.open .langs a,header.mnav.open .langs span[aria-current]{display:inline-flex;align-items:center;justify-content:center;width:auto !important;height:auto !important;flex:none;min-height:44px;padding:0 10px !important;font-size:15px}
  body.mnav-lock{overflow:hidden}
}

@media (max-width: 760px){
  /* Márgenes laterales de 16px en vez de 48px */
  .mc main>section,.mc main>div,.mc>section,.mc>nav,.mc main>nav,.mc footer>div,.mc [style*="max-width: 1280px"]{padding-left:16px !important;padding-right:16px !important}
  .mc [style*="padding: 96px 48px"],.mc [style*="padding: 112px 48px"],.mc [style*="padding: 120px 48px"]{padding-top:56px !important;padding-bottom:56px !important}
  .mc section[style*="padding: 96px 48px 64px"]{padding-top:32px !important}
  .mc section[style*="padding: 64px 48px 80px"],.mc nav[style*="padding: 24px 48px 0"]+section{padding-top:20px !important}
  .mc nav[style*="padding: 24px 48px 0"]{padding-top:12px !important}
  /* El índice de las páginas legales, que en el teléfono quedaba antes del texto, se oculta: el texto empieza arriba */
  .mc aside[style*="sticky"]{display:none !important}
  .mc [style*="padding: 64px 48px"]{padding-top:40px !important}
  /* Tarjetas con mucho relleno */
  .mc [style*="padding: 64px"]:not([style*="padding: 64px 48px"]),.mc [style*="padding: 72px 64px"],.mc [style*="padding: 56px"]{padding:28px 20px !important}
  .mc [style*="padding: 48px;"],.mc [style*="padding: 48px\""]{padding:24px 20px !important}
  /* Títulos */
  .mc h1{font-size:clamp(34px,9.5vw,44px) !important;letter-spacing:-1px !important;line-height:1.08 !important}
  .mc .h2,.mc h2[style*="font-size: 4"],.mc h2[style*="font-size: 5"],.mc h2[style*="font-size: 6"]{font-size:30px !important;letter-spacing:-.6px !important}
  .mc [style*="font-size: 36px"],.mc [style*="font-size: 38px"],.mc [style*="font-size: 40px"]{font-size:28px !important}
  .mc p[style*="font-size: 20px"],.mc p[style*="font-size: 19px"]{font-size:17px !important}
  /* Grandes espacios entre bloques */
  .mc [style*="gap: 56px"],.mc [style*="gap: 64px"],.mc [style*="gap: 72px"]{gap:32px !important}
  /* Datos en tres columnas (código, terminales, tiempo): que no se aprieten */
  .mc dl[style*="repeat(3, minmax(0, 1fr))"]{gap:8px !important}
  .mc dl[style*="repeat(3, minmax(0, 1fr))"]>div{padding:12px !important}
  /* El índice "En esta página" de las páginas legales no se queda pegado encima del texto */
  .mc aside[style*="sticky"]{position:static !important}
  /* Footer: una columna. Arriba la marca, contacto y redes; abajo cada sección se abre con un toque */
  .mc footer>div{padding-top:40px !important;padding-bottom:32px !important;gap:28px !important}
  .mc footer>div>div[style*="grid-template-columns"]{display:flex !important;flex-direction:column !important;gap:0 !important}
  .mc footer>div>div[style*="grid-template-columns"]>div:first-child{gap:12px !important;padding-bottom:28px;font-size:15px !important}
  .mc footer img[alt="Muvon"]{height:28px !important}
  .mc footer address{gap:2px !important}
  .mc footer address a{display:inline-flex;align-items:center;min-height:36px;-webkit-user-select:text;user-select:text}
  .mc footer .fcol{gap:0 !important;border-top:1px solid #EDEDF0}
  .mc footer .fcol:last-of-type{border-bottom:1px solid #EDEDF0}
  .mc footer .fcol>.ftitle{display:flex;justify-content:space-between;align-items:center;min-height:56px;cursor:pointer;font-size:16px}
  .mc footer .fcol>.ftitle .ms{display:inline-block;font-size:22px;color:#4A4A50}
  .mc footer .fcol>a{display:none}
  .mc footer .fcol.open>a{display:flex;align-items:center;min-height:44px;font-size:15px}
  .mc footer .fcol.open{padding-bottom:10px}
  .mc footer .fcol.open>.ftitle .ms{transform:rotate(180deg)}
  /* Nada más ancho que la pantalla */
  .mc img,.mc iframe,.mc video{max-width:100%}
  .mc{overflow-x:clip}
}