/* ==========================================================================
   Menu movil (hamburguesa) - custom 2026-09-26
   Paginas con el menu Mobirise .cid-tjjJk8j7ym: index, en/index, cv, en/cv,
   tarifas y wiki. Solo afecta a <=991px (menu colapsado de Bootstrap);
   el menu de escritorio (>=992px) queda igual.
   No se toca assets/mobirise/css/mbr-additional.css: esto son overrides.
   --mm-k: factor para paginas con viewport initial-scale=0.75 (cv, en/cv,
   tarifas): alli 44px CSS se verian como 33px reales, asi que esas paginas
   definen --mm-k: 1.3333 en su <style> para mantener objetivos de >=44px.
   ========================================================================== */
:root { --mm-k: 1; --mm-ink: #1f2328; --mm-accent: #1a73a8; --mm-line: rgba(15, 23, 42, 0.08); }

@media (max-width: 991.98px) {
  /* ---- Boton hamburguesa: area tactil de 44x44 y animacion a X ---- */
  .cid-tjjJk8j7ym .navbar .navbar-brand { width: calc(100% - 44px * var(--mm-k)); }
  .cid-tjjJk8j7ym .navbar button.navbar-toggler {
    width: calc(44px * var(--mm-k));
    height: calc(44px * var(--mm-k));
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    align-self: center;
    padding: 0;
    margin: 0 calc(-8px * var(--mm-k)) 0 0;
    border: 0;
    border-radius: 12px;
    background: transparent;
    box-shadow: none;
    -webkit-tap-highlight-color: transparent;
    touch-action: manipulation;
  }
  .cid-tjjJk8j7ym .navbar button.navbar-toggler:focus { box-shadow: none; }
  .cid-tjjJk8j7ym .navbar button.navbar-toggler:focus-visible { outline: 3px solid var(--mm-accent); outline-offset: 2px; }
  .cid-tjjJk8j7ym .navbar button.navbar-toggler .hamburger {
    position: relative;
    display: block;
    width: calc(26px * var(--mm-k));
    height: calc(18px * var(--mm-k));
  }
  .cid-tjjJk8j7ym .navbar button.navbar-toggler .hamburger span {
    position: absolute;
    right: 0;
    width: 100%;
    height: calc(2px * var(--mm-k));
    border-radius: 2px;
    background-color: var(--mm-ink);
    opacity: 1;
    transform: none;
    transition: top 0.25s ease, width 0.25s ease, right 0.25s ease, opacity 0.2s ease, transform 0.3s cubic-bezier(0.4, 0, 0.2, 1);
  }
  .cid-tjjJk8j7ym .navbar button.navbar-toggler .hamburger span:nth-child(1) { top: 0; }
  .cid-tjjJk8j7ym .navbar button.navbar-toggler .hamburger span:nth-child(2),
  .cid-tjjJk8j7ym .navbar button.navbar-toggler .hamburger span:nth-child(3) { top: calc(8px * var(--mm-k)); }
  .cid-tjjJk8j7ym .navbar button.navbar-toggler .hamburger span:nth-child(4) { top: calc(16px * var(--mm-k)); }
  .cid-tjjJk8j7ym .navbar.opened button.navbar-toggler .hamburger span:nth-child(1),
  .cid-tjjJk8j7ym .navbar.opened button.navbar-toggler .hamburger span:nth-child(4) {
    top: calc(8px * var(--mm-k)); width: 0; right: 50%; opacity: 0;
  }
  .cid-tjjJk8j7ym .navbar.opened button.navbar-toggler .hamburger span:nth-child(2) { transform: rotate(45deg); }
  .cid-tjjJk8j7ym .navbar.opened button.navbar-toggler .hamburger span:nth-child(3) { transform: rotate(-45deg); }

  /* ---- Header abierto: fondo solido (texto legible sobre el header translucido) ---- */
  .cid-tjjJk8j7ym nav.navbar.opened {
    background: #ffffff !important;
    box-shadow: 0 18px 40px rgba(15, 23, 42, 0.18);
  }

  /* ---- Panel: ancho completo, filas grandes, scroll propio si no cabe ---- */
  .cid-tjjJk8j7ym .navbar .navbar-collapse {
    width: 100vw;
    max-width: 100vw;
    flex-basis: 100vw;
    margin-left: calc(50% - 50vw);
    margin-right: calc(50% - 50vw);
    background: #ffffff;
  }
  .cid-tjjJk8j7ym .navbar .navbar-collapse.show {
    max-height: calc(100vh - var(--mm-panel-top, 90px));
    max-height: calc(100dvh - var(--mm-panel-top, 90px));
    overflow-y: auto;
    overscroll-behavior: contain;
    -webkit-overflow-scrolling: touch;
  }
  .cid-tjjJk8j7ym .navbar .navbar-collapse .navbar-nav,
  .cid-tjjJk8j7ym .navbar .navbar-collapse .navbar-buttons {
    transition: opacity 0.25s ease, transform 0.3s ease;
  }
  .cid-tjjJk8j7ym .navbar .navbar-collapse:not(.show) .navbar-nav,
  .cid-tjjJk8j7ym .navbar .navbar-collapse:not(.show) .navbar-buttons {
    opacity: 0;
    transform: translateY(-8px);
  }
  .cid-tjjJk8j7ym .navbar .navbar-collapse .navbar-nav {
    width: 100%;
    margin: 0;
    padding: 8px 0 0;
    flex-direction: column;
    flex-wrap: nowrap;
    align-items: stretch;
    border-top: 1px solid var(--mm-line);
  }
  /* Avatar circular (sobresale ~32px del header, ~46px con el header compacto al hacer scroll):
     - .navbar-brand y el panel tienen z-index:1 en mbr-additional.css y el panel, al ir despues
       en el DOM, tapaba la mitad inferior del circulo: con el menu abierto se sube la marca.
     - El panel deja arriba el alto que sobresale el avatar (--mm-av-overlap, medido en
       mobile-menu.js al abrir) + 16px de aire, asi "Acerca de" empieza debajo del circulo. */
  .cid-tjjJk8j7ym .navbar.mm-avatar.opened .navbar-brand { z-index: 3; }
  .cid-tjjJk8j7ym .navbar.mm-avatar .navbar-collapse .navbar-nav {
    padding-top: calc(var(--mm-av-overlap, 32px) + 16px);
    border-top: 0;
  }
  .cid-tjjJk8j7ym .navbar .navbar-collapse .navbar-nav li.nav-item { width: 100%; margin: 0 !important; }
  .cid-tjjJk8j7ym .navbar .navbar-collapse .nav-dropdown .nav-link.link {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    min-height: calc(52px * var(--mm-k));
    margin: 0 !important;
    padding: 0 calc(24px * var(--mm-k)) !important;
    border-bottom: 1px solid var(--mm-line);
    color: var(--mm-ink) !important;
    font-size: calc(18px * var(--mm-k));
    font-weight: 500;
    line-height: 1.3;
    text-align: left;
    -webkit-tap-highlight-color: rgba(26, 115, 168, 0.12);
  }
  .cid-tjjJk8j7ym .navbar .navbar-collapse .nav-dropdown .nav-link.link:active,
  .cid-tjjJk8j7ym .navbar .navbar-collapse .nav-dropdown .nav-link.link:hover { background: #f3f7fa; }
  .cid-tjjJk8j7ym .navbar .navbar-collapse .nav-dropdown .nav-link.link[aria-current="page"] {
    color: var(--mm-accent) !important;
    font-weight: 600;
    box-shadow: inset 4px 0 0 var(--mm-accent);
  }
  .cid-tjjJk8j7ym .navbar .navbar-collapse a:focus-visible,
  .cid-tjjJk8j7ym .navbar .navbar-collapse button:focus-visible {
    outline: 3px solid var(--mm-accent) !important;
    outline-offset: -3px;
  }
  /* Submenu "Acerca de": acordeon dentro del panel */
  .cid-tjjJk8j7ym .navbar .navbar-collapse .nav-dropdown .nav-link.dropdown-toggle::after {
    margin: 0 0 0 12px;
    transition: transform 0.25s ease;
  }
  .cid-tjjJk8j7ym .navbar .navbar-collapse .nav-dropdown .nav-link.dropdown-toggle[aria-expanded="true"] {
    padding: 0 calc(24px * var(--mm-k)) !important;
    background: #f3f7fa;
  }
  .cid-tjjJk8j7ym .navbar .navbar-collapse .nav-dropdown .nav-link.dropdown-toggle[aria-expanded="true"]::after { transform: rotate(180deg); }
  .cid-tjjJk8j7ym .navbar .navbar-collapse .dropdown-menu {
    position: static !important;
    inset: auto !important;
    transform: none !important;
    float: none;
    width: 100%;
    min-width: 0;
    margin: 0 !important;
    padding: 4px 0;
    border: 0;
    border-bottom: 1px solid var(--mm-line);
    border-radius: 0;
    box-shadow: none;
    background: #f6f8fa !important;
  }
  .cid-tjjJk8j7ym .navbar .navbar-collapse .dropdown-menu.show { animation: mm-drop 0.22s ease-out; }
  .cid-tjjJk8j7ym .navbar .navbar-collapse .dropdown-menu .dropdown-item {
    display: flex;
    align-items: center;
    min-height: calc(48px * var(--mm-k));
    padding: 0 calc(24px * var(--mm-k)) 0 calc(40px * var(--mm-k)) !important;
    border: 0;
    border-radius: 0 !important;
    background: transparent !important;
    color: #374151 !important;
    font-size: calc(16px * var(--mm-k));
    line-height: 1.3;
    text-align: left;
    white-space: normal;
  }
  .cid-tjjJk8j7ym .navbar .navbar-collapse .dropdown-menu .dropdown-item:hover,
  .cid-tjjJk8j7ym .navbar .navbar-collapse .dropdown-menu .dropdown-item:focus,
  .cid-tjjJk8j7ym .navbar .navbar-collapse .dropdown-menu .dropdown-item:active {
    background: #e8f3fa !important;
    color: #0b5a85 !important;
  }
  .cid-tjjJk8j7ym .navbar .navbar-collapse .dropdown-menu .dropdown-item::before { display: none; }

  /* Idioma + boton "Hablemos" */
  .cid-tjjJk8j7ym .navbar .navbar-collapse .navbar-buttons {
    display: flex !important;
    flex-wrap: wrap;
    align-items: center;
    justify-content: flex-start;
    gap: 12px;
    width: 100%;
    min-width: 0;
    margin: 0;
    padding: calc(16px * var(--mm-k)) calc(24px * var(--mm-k)) calc(22px * var(--mm-k));
    text-align: left;
  }
  .cid-tjjJk8j7ym .navbar .navbar-collapse .navbar-buttons .lang-switch { margin: 0; }
  .cid-tjjJk8j7ym .navbar .navbar-collapse .navbar-buttons .lang-switch__option {
    min-width: calc(52px * var(--mm-k));
    min-height: calc(42px * var(--mm-k));
    padding: 0 calc(14px * var(--mm-k));
    font-size: calc(15px * var(--mm-k));
  }
  .cid-tjjJk8j7ym .navbar .navbar-collapse .navbar-buttons .btn {
    flex: 1 1 160px;
    min-height: calc(48px * var(--mm-k));
    margin: 0 !important;
    padding: 0 calc(20px * var(--mm-k));
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: calc(17px * var(--mm-k));
    border-radius: 999px;
  }

  /* ---- Fondo oscurecido + bloqueo de scroll mientras el menu esta abierto ---- */
  html.mm-lock,
  html.mm-lock body { overflow: hidden !important; }
  body::after {
    content: "";
    position: fixed;
    inset: 0;
    z-index: 999;
    background: rgba(15, 23, 42, 0.45);
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.25s ease, visibility 0s linear 0.25s;
  }
  html.mm-lock body::after { opacity: 1; visibility: visible; transition: opacity 0.25s ease; }
  html.mm-lock #chatbutton-wa,
  html.mm-lock .floating-wpp { opacity: 0 !important; pointer-events: none !important; }
}

@keyframes mm-drop {
  from { opacity: 0; transform: translateY(-6px); }
  to { opacity: 1; transform: none; }
}

@media (max-width: 991.98px) and (prefers-reduced-motion: reduce) {
  .cid-tjjJk8j7ym .navbar .navbar-collapse.collapsing { transition: none !important; }
  .cid-tjjJk8j7ym .navbar button.navbar-toggler .hamburger span,
  .cid-tjjJk8j7ym .navbar .navbar-collapse .navbar-nav,
  .cid-tjjJk8j7ym .navbar .navbar-collapse .navbar-buttons,
  .cid-tjjJk8j7ym .navbar .navbar-collapse .nav-link.dropdown-toggle::after,
  body::after { transition: none !important; }
  .cid-tjjJk8j7ym .navbar .navbar-collapse .dropdown-menu.show { animation: none !important; }
}