.yolia-pro-nav{position:sticky;inset-block-start:0;z-index:97000;inline-size:100%;background:var(--ynp-bg,#fffdf8);color:var(--ynp-text,#173326);border-block-end:.0625rem solid var(--ynp-border,rgba(24,51,38,.14));font-family:Inter,system-ui,sans-serif;box-shadow:0 .45rem 1.4rem rgba(32,49,37,.045)}.yolia-pro-nav *{box-sizing:border-box}.ynp-shell{position:relative;inline-size:min(100%,var(--ynp-max,85rem));margin-inline:auto;padding:var(--ynp-pad-y,.75rem) var(--ynp-pad-x,1.125rem);display:grid;grid-template-columns:max-content minmax(0,1fr);align-items:center;gap:clamp(.75rem,2.2%,1.5rem);min-block-size:5.25rem}.ynp-brand{display:inline-flex;align-items:center;justify-content:flex-start;inline-size:max-content;max-inline-size:min(100%,16rem);text-decoration:none;color:inherit;flex:none}.ynp-brand img{display:block;inline-size:var(--ynp-logo-w,7rem);block-size:var(--ynp-logo-h,3.625rem);object-fit:contain;object-position:left center;max-inline-size:none}.ynp-brand span{font:800 1.12rem/1.1 Fraunces,serif}.ynp-main-panel{display:grid;grid-template-columns:minmax(0,1fr) max-content;align-items:center;gap:1rem;min-inline-size:0}.ynp-links{display:flex;align-items:center;justify-content:center;gap:var(--ynp-gap,.625rem);min-inline-size:0}.ynp-item{position:relative;min-inline-size:0}.ynp-item-head{display:flex;align-items:center;border-radius:.85rem}.ynp-link{display:flex;align-items:center;min-block-size:2.65rem;padding:.62rem .78rem;border-radius:.85rem;color:var(--ynp-text,#173326);font-size:.9rem;font-weight:750;line-height:1.15;text-decoration:none;white-space:nowrap;transition:background .16s ease,color .16s ease,transform .16s ease}.ynp-link:hover,.ynp-item[data-ynp-open="1"]>.ynp-item-head>.ynp-link{background:var(--ynp-hover-bg,rgba(38,103,62,.08));color:var(--ynp-active-text,#075c9d)}.ynp-link[aria-current="page"]{background:var(--ynp-active-bg,rgba(38,103,62,.12));color:var(--ynp-active-text,#075c9d)}.ynp-sub-toggle{display:inline-flex;align-items:center;justify-content:center;inline-size:1.85rem;block-size:2.65rem;margin-inline-start:-.32rem;border:0;background:transparent;color:currentColor;border-radius:.75rem;cursor:pointer;font:800 1rem/1 system-ui;transition:background .16s ease,transform .16s ease}.ynp-sub-toggle:hover{background:var(--ynp-hover-bg,rgba(38,103,62,.08))}.ynp-item[data-ynp-open="1"]>.ynp-item-head>.ynp-sub-toggle{transform:rotate(180deg)}.ynp-submenu{position:absolute;inset-block-start:calc(100% + .48rem);inset-inline-start:0;z-index:98000;inline-size:max-content;min-inline-size:var(--ynp-sub-min,15.5rem);max-inline-size:22rem;padding:.5rem;background:var(--ynp-sub-bg,#fff);color:var(--ynp-sub-text,#173326);border:.0625rem solid var(--ynp-border,rgba(24,51,38,.14));border-radius:var(--ynp-sub-radius,1rem);box-shadow:0 1rem 2.8rem rgba(29,47,35,.16)}.ynp-submenu[hidden]{display:none!important}.ynp-submenu .ynp-link{inline-size:100%;min-block-size:2.7rem;padding:.7rem .8rem;color:var(--ynp-sub-text,#173326);white-space:normal}.ynp-submenu .ynp-link:hover{background:var(--ynp-sub-hover,rgba(38,103,62,.08));color:var(--ynp-active-text,#075c9d)}.ynp-submenu .ynp-item{inline-size:100%}.ynp-submenu .ynp-item-head{inline-size:100%;display:grid;grid-template-columns:minmax(0,1fr) auto}.ynp-submenu .ynp-submenu{inset-block-start:-.45rem;inset-inline-start:calc(100% + .42rem)}.ynp-actions{display:flex;align-items:center;justify-content:flex-end;gap:.5rem;min-inline-size:max-content}.ynp-action-wrap{position:relative;display:inline-flex;align-items:center}.ynp-icon-btn,.ynp-avatar{display:inline-flex;align-items:center;justify-content:center;gap:.18rem;min-inline-size:2.8rem;block-size:2.8rem;padding:0 .62rem;border:.0625rem solid color-mix(in srgb,var(--ynp-text,#173326) 18%,transparent);border-radius:999rem;background:color-mix(in srgb,var(--ynp-bg,#fffdf8) 92%,#fff);color:var(--ynp-text,#173326);cursor:pointer;box-shadow:0 .28rem .9rem rgba(30,48,36,.05);font:800 .75rem/1 Inter,sans-serif;transition:background .16s ease,border-color .16s ease,transform .16s ease}.ynp-icon-btn:hover,.ynp-avatar:hover{background:var(--ynp-hover-bg,rgba(38,103,62,.08));border-color:color-mix(in srgb,var(--ynp-text,#173326) 30%,transparent);transform:translateY(-.05rem)}.ynp-icon-btn .icon,.ynp-icon-btn svg{inline-size:1.2rem;block-size:1.2rem;display:inline-flex}.ynp-current-code{font-size:.62rem;letter-spacing:.04em}.ynp-avatar{inline-size:2.8rem;padding:0;font-size:.78rem;letter-spacing:.03em}.ynp-dropdown{position:absolute;inset-block-start:calc(100% + .58rem);inset-inline-end:0;z-index:99000;min-inline-size:15.5rem;max-inline-size:min(22rem,90%);padding:.55rem;background:var(--ynp-sub-bg,#fff);color:var(--ynp-sub-text,#173326);border:.0625rem solid var(--ynp-border,rgba(24,51,38,.14));border-radius:1rem;box-shadow:0 1.15rem 3.2rem rgba(29,47,35,.18)}.ynp-dropdown[hidden]{display:none!important}.ynp-dropdown-title{padding:.45rem .62rem .62rem;font-size:.72rem;font-weight:850;letter-spacing:.08em;text-transform:uppercase;color:color-mix(in srgb,var(--ynp-sub-text,#173326) 66%,transparent)}.ynp-dropdown a,.ynp-dropdown button{display:flex;align-items:center;gap:.62rem;inline-size:100%;min-block-size:2.65rem;padding:.66rem .72rem;border:0;border-radius:.78rem;background:transparent;color:inherit;text-align:start;text-decoration:none;font:700 .84rem/1.25 Inter,sans-serif;cursor:pointer}.ynp-dropdown a:hover,.ynp-dropdown button:hover{background:var(--ynp-sub-hover,rgba(38,103,62,.08))}.ynp-lang-dropdown{min-inline-size:18rem;max-block-size:30rem;overflow:auto}.ynp-lang-option{display:grid!important;grid-template-columns:minmax(0,1fr) auto;gap:.8rem!important}.ynp-lang-option small{font-size:.68rem;font-weight:850;opacity:.58}.ynp-lang-option.is-active{background:var(--ynp-active-bg,rgba(38,103,62,.12))!important;color:var(--ynp-active-text,#075c9d)!important}.ynp-user-head{display:grid;gap:.18rem;padding:.62rem .7rem .72rem;border-block-end:.0625rem solid color-mix(in srgb,var(--ynp-sub-text,#173326) 12%,transparent);margin-block-end:.35rem}.ynp-user-head strong{font-size:.9rem}.ynp-user-head small{font-size:.72rem;opacity:.68;overflow-wrap:anywhere}.ynp-empty{padding:.8rem .72rem;font-size:.8rem;line-height:1.4;opacity:.72}.ynp-danger{color:#a43b30!important}.ynp-login,.ynp-cta{display:inline-flex;align-items:center;justify-content:center;min-block-size:2.75rem;padding:.62rem .92rem;border-radius:.85rem;text-decoration:none;font:800 .84rem/1 Inter,sans-serif;white-space:nowrap}.ynp-login{color:var(--ynp-text,#173326);border:.0625rem solid var(--ynp-border,rgba(24,51,38,.14));background:transparent}.ynp-login:hover{background:var(--ynp-hover-bg,rgba(38,103,62,.08))}.ynp-cta{background:var(--ynp-btn-bg,#e36f3d);color:var(--ynp-btn-text,#fff);border:.0625rem solid color-mix(in srgb,var(--ynp-btn-bg,#e36f3d) 82%,#000);box-shadow:0 .38rem 1rem color-mix(in srgb,var(--ynp-btn-bg,#e36f3d) 18%,transparent)}.ynp-main-toggle{display:none;align-items:center;justify-content:center;inline-size:2.8rem;block-size:2.8rem;border:.0625rem solid var(--ynp-border,rgba(24,51,38,.14));border-radius:.85rem;background:transparent;color:var(--ynp-text,#173326);cursor:pointer;font-size:1.15rem}.yolia-pro-nav[data-yolia-pro-compact="1"] .ynp-shell{grid-template-columns:max-content max-content;justify-content:space-between}.yolia-pro-nav[data-yolia-pro-compact="1"] .ynp-main-toggle{display:inline-flex}.yolia-pro-nav[data-yolia-pro-compact="1"] .ynp-main-panel{display:none;position:absolute;inset-block-start:calc(100% + .35rem);inset-inline:var(--ynp-pad-x,1rem);z-index:97500;padding:.72rem;background:var(--ynp-sub-bg,#fff);color:var(--ynp-sub-text,#173326);border:.0625rem solid var(--ynp-border,rgba(24,51,38,.14));border-radius:1.1rem;box-shadow:0 1.1rem 3rem rgba(29,47,35,.2);max-block-size:36rem;overflow:auto}.yolia-pro-nav[data-yolia-pro-compact="1"][data-yolia-pro-open="1"] .ynp-main-panel{display:grid;grid-template-columns:1fr;gap:.7rem}.yolia-pro-nav[data-yolia-pro-compact="1"] .ynp-links{display:grid;grid-template-columns:1fr;gap:.2rem;align-items:stretch}.yolia-pro-nav[data-yolia-pro-compact="1"] .ynp-item,.yolia-pro-nav[data-yolia-pro-compact="1"] .ynp-item-head,.yolia-pro-nav[data-yolia-pro-compact="1"] .ynp-link{inline-size:100%}.yolia-pro-nav[data-yolia-pro-compact="1"] .ynp-item-head{display:grid;grid-template-columns:minmax(0,1fr) auto}.yolia-pro-nav[data-yolia-pro-compact="1"] .ynp-sub-toggle{margin-inline-start:0}.yolia-pro-nav[data-yolia-pro-compact="1"] .ynp-submenu,.yolia-pro-nav[data-yolia-pro-compact="1"] .ynp-submenu .ynp-submenu{position:static;inline-size:100%;min-inline-size:0;max-inline-size:none;margin-block:.18rem .36rem;padding:.35rem .35rem .35rem .7rem;border-radius:.78rem;box-shadow:none;background:color-mix(in srgb,var(--ynp-sub-bg,#fff) 88%,var(--ynp-hover-bg,rgba(38,103,62,.08)))}.yolia-pro-nav[data-yolia-pro-compact="1"] .ynp-actions{justify-content:flex-start;flex-wrap:wrap;min-inline-size:0;padding-block-start:.35rem;border-block-start:.0625rem solid var(--ynp-border,rgba(24,51,38,.14))}.yolia-pro-nav[data-yolia-pro-compact="1"] .ynp-action-wrap{position:static}.yolia-pro-nav[data-yolia-pro-compact="1"] .ynp-dropdown{position:absolute;inset-inline:.72rem;inset-block-start:auto;margin-block-start:.35rem;max-inline-size:none}[dir="rtl"] .ynp-brand img{object-position:right center}[dir="rtl"] .ynp-submenu{inset-inline-start:auto;inset-inline-end:0}[dir="rtl"] .ynp-submenu .ynp-submenu{inset-inline-end:calc(100% + .42rem)}

/* ═══════════════════════════════════════════════════════════════
   ARREGLO: los menus desplegables del navbar (idioma, usuario)
   aparecian con las letras apiladas verticalmente, una por linea.
   Forzamos su ancho, layout y tipografia correctos con maxima
   prioridad para que ninguna otra regla los pueda pisar.
   ═══════════════════════════════════════════════════════════════ */
.yolia-pro-nav .ynp-dropdown{
  display: block !important;
  position: absolute !important;
  inline-size: auto !important;
  width: auto !important;
  min-width: 15.5rem !important;
  min-inline-size: 15.5rem !important;
  max-width: min(22rem, 90vw) !important;
  max-inline-size: min(22rem, 90vw) !important;
  writing-mode: horizontal-tb !important;
  white-space: normal !important;
  word-break: normal !important;
  overflow-wrap: normal !important;
}
.yolia-pro-nav .ynp-dropdown[hidden]{ display:none !important; }
.yolia-pro-nav .ynp-dropdown-title{
  font-size: .72rem !important;
  writing-mode: horizontal-tb !important;
}
.yolia-pro-nav .ynp-dropdown a,
.yolia-pro-nav .ynp-dropdown button{
  display: flex !important;
  flex-direction: row !important;
  width: 100% !important;
  writing-mode: horizontal-tb !important;
  white-space: normal !important;
  font-size: .84rem !important;
}
.yolia-pro-nav .ynp-lang-option{
  display: grid !important;
  grid-template-columns: minmax(0,1fr) auto !important;
  writing-mode: horizontal-tb !important;
}
.yolia-pro-nav .ynp-user-head{
  display: grid !important;
  writing-mode: horizontal-tb !important;
}

/* ═══════════════════════════════════════════════════════════════
   ARREGLO 2: el navbar SIEMPRE va en UNA SOLA LINEA horizontal,
   tanto en escritorio como en responsive/movil — nunca se apila en
   varias filas ni en una lista vertical de botones. En vez de
   esconder el menu detras de un boton hamburguesa que lo convertia
   en una pila vertical de pastillas, ahora el logo queda fijo a la
   izquierda y el resto (links + idioma + sesion/CTA) es una sola
   fila horizontal que se desplaza con scroll lateral si no cabe.
   Tambien se fuerzan colores de texto legibles en todos los menus
   desplegables para que nunca aparezca texto blanco sobre fondo
   blanco (o cualquier combinacion sin contraste).
   ═══════════════════════════════════════════════════════════════ */
.yolia-pro-nav,
.yolia-pro-nav[data-yolia-pro-compact="1"]{
  overflow: visible;
}
/* YOLIA_FIX_2026_NAV_RESPONSIVE (queja de Eduardo: en "Zona Universitaria"
   quedaba una barra de scroll horizontal fea en el navbar, y en celular/
   tablet el menú nunca se colapsaba al botón hamburguesa). Las reglas de
   aquí abajo ("ARREGLO 2" original) forzaban SIEMPRE una sola fila
   horizontal con scroll lateral, en los DOS modos (compacto y no
   compacto) -- eso apagaba por completo el colapso a hamburguesa que el
   propio CSS ya define para data-yolia-pro-compact="1" (menú oculto,
   botón hamburguesa visible, lista vertical al abrir). Ahora estas reglas
   SOLO aplican cuando el navbar decide que SÍ cabe en una fila
   (:not([data-yolia-pro-compact="1"])); en modo compacto se respeta el
   comportamiento original (hamburguesa + menú vertical desplegable). */
.yolia-pro-nav:not([data-yolia-pro-compact="1"]) .ynp-shell{
  grid-template-columns: max-content minmax(0,1fr) !important;
  justify-content: initial !important;
  flex-wrap: nowrap !important;
}
.yolia-pro-nav:not([data-yolia-pro-compact="1"]) .ynp-main-panel{
  display: flex !important;
  flex-direction: row !important;
  flex-wrap: nowrap !important;
  align-items: center !important;
  justify-content: flex-start !important;
  gap: clamp(.5rem,2vw,1rem) !important;
  min-inline-size: 0 !important;
  inline-size: auto !important;
  overflow-x: auto !important;
  overflow-y: visible !important;
  -webkit-overflow-scrolling: touch !important;
  scrollbar-width: thin !important;
  position: static !important;
  inset: auto !important;
  padding: 0 !important;
  margin: 0 !important;
  border: 0 !important;
  box-shadow: none !important;
  background: transparent !important;
  max-block-size: none !important;
  pointer-events: auto !important;
  opacity: 1 !important;
  visibility: visible !important;
  transform: none !important;
}
.yolia-pro-nav:not([data-yolia-pro-compact="1"]) .ynp-links{
  display: flex !important;
  flex-direction: row !important;
  flex-wrap: nowrap !important;
  flex: 0 0 auto !important;
  align-items: stretch !important;
  gap: var(--ynp-gap,.625rem) !important;
}
.yolia-pro-nav:not([data-yolia-pro-compact="1"]) .ynp-item,
.yolia-pro-nav:not([data-yolia-pro-compact="1"]) .ynp-item-head,
.yolia-pro-nav:not([data-yolia-pro-compact="1"]) .ynp-link{
  inline-size: auto !important;
  white-space: nowrap !important;
}
.yolia-pro-nav:not([data-yolia-pro-compact="1"]) .ynp-actions{
  flex: 0 0 auto !important;
  flex-wrap: nowrap !important;
  padding-block-start: 0 !important;
  border-block-start: 0 !important;
}
.yolia-pro-nav:not([data-yolia-pro-compact="1"]) .ynp-main-toggle{ display: none !important; }
.yolia-pro-nav .ynp-action-wrap,
.yolia-pro-nav[data-yolia-pro-compact="1"] .ynp-action-wrap{ position: relative !important; }
.yolia-pro-nav .ynp-dropdown,
.yolia-pro-nav[data-yolia-pro-compact="1"] .ynp-dropdown{
  position: absolute !important;
  inset-inline-start: auto !important;
  inset-inline-end: 0 !important;
  inset-block-start: calc(100% + .58rem) !important;
  margin-block-start: 0 !important;
  max-inline-size: min(22rem,92vw) !important;
}

/* nunca texto invisible: se fuerza contraste real en todo el navbar */
.yolia-pro-nav .ynp-main-panel,
.yolia-pro-nav .ynp-links,
.yolia-pro-nav .ynp-link,
.yolia-pro-nav .ynp-icon-btn,
.yolia-pro-nav .ynp-avatar,
.yolia-pro-nav .ynp-login{
  color: var(--ynp-text,#173326) !important;
}
.yolia-pro-nav .ynp-icon-btn,
.yolia-pro-nav .ynp-avatar,
.yolia-pro-nav .ynp-login{
  background: var(--ynp-bg,#fffdf8) !important;
}
.yolia-pro-nav .ynp-dropdown{
  background: var(--ynp-sub-bg,#fff) !important;
}
.yolia-pro-nav .ynp-dropdown a,
.yolia-pro-nav .ynp-dropdown button,
.yolia-pro-nav .ynp-dropdown-title,
.yolia-pro-nav .ynp-user-head strong,
.yolia-pro-nav .ynp-user-head small,
.yolia-pro-nav .ynp-empty{
  color: var(--ynp-sub-text,#173326) !important;
  background: transparent !important;
}
.yolia-pro-nav .ynp-cta{
  color: var(--ynp-btn-text,#fff) !important;
  background: var(--ynp-btn-bg,#e36f3d) !important;
}

@media (max-width: 30rem){
  .yolia-pro-nav .ynp-shell{ min-block-size: 4.4rem !important; padding-inline: .75rem !important; }
  .yolia-pro-nav .ynp-link{ font-size: .82rem !important; padding: .5rem .58rem !important; min-block-size: 2.3rem !important; }
  .yolia-pro-nav .ynp-icon-btn,.yolia-pro-nav .ynp-avatar{ min-inline-size: 2.4rem !important; block-size: 2.4rem !important; }
  .yolia-pro-nav .ynp-login,.yolia-pro-nav .ynp-cta{ min-block-size: 2.4rem !important; padding: .5rem .7rem !important; font-size: .78rem !important; }
}

/* ═══════════════════════════════════════════════════════════════
   ARREGLO 3 (pedido de Eduardo: "mira cómo abre el submenu, está
   mal"): la hoja de estilos ORIGINAL (arriba del todo, la regla
   minificada de una sola linea) todavia trae una regla vieja de
   cuando el navbar en modo compacto se apilaba en vertical:
     [data-yolia-pro-compact="1"] .ynp-submenu{ position:static; ... }
   Pero "ARREGLO 2" ya fuerza la fila horizontal con scroll lateral
   en AMBOS modos (compacto y no compacto) -- el apilado vertical ya
   no existe a ningun ancho. Esa regla vieja quedaba viva y hacia que
   el submenu, en vez de flotar como un menu, se insertara como una
   celda mas dentro de la fila que se desplaza lateralmente (por eso
   se veia "cortado" o en el lugar equivocado). La neutralizamos aqui
   y dejamos que el JS (yolia-navbar-pro.js) decida la posicion real
   con position:fixed calculado desde el boton, siempre. */
.yolia-pro-nav[data-yolia-pro-compact="1"] .ynp-submenu,
.yolia-pro-nav[data-yolia-pro-compact="1"] .ynp-submenu .ynp-submenu{
  position: absolute !important;
  inline-size: max-content !important;
  min-inline-size: var(--ynp-sub-min,15.5rem) !important;
  max-inline-size: 22rem !important;
  margin-block: 0 !important;
  box-shadow: 0 1rem 2.8rem rgba(29,47,35,.16) !important;
  background: var(--ynp-sub-bg,#fff) !important;
}

/* ═══════════════════════════════════════════════════════════════
   ARREGLO 4 (Eduardo, 2026-09-14): el pastilla de unidades
   (Auto / °C / °F, la inserta por JS yolia-context-runtime.js junto
   al boton de idioma, dentro de .ynp-actions -- ver su funcion
   mount()) nunca tuvo una regla propia para convivir AHI DENTRO del
   navbar. Su unico CSS (.yolia-unit-switch en
   yolia-context-runtime.css) fue pensado para cuando flota sola en
   la esquina de la pantalla (.yolia-unit-switch--floating), asi que
   en pantallas angostas se veia enorme y aplastaba el boton de
   idioma junto a ella. Aqui se compacta SOLO cuando vive dentro del
   navbar (.yolia-unit-switch--floating no se toca, sigue igual). No
   se esconde el widget -- Eduardo quiere poder seguir cambiando de
   unidad, solo que quepa bien. */
.yolia-pro-nav .ynp-actions > .yolia-unit-switch{
  flex: 0 0 auto !important;
}
@media (max-width: 30rem){
  .yolia-pro-nav .ynp-actions > .yolia-unit-switch{
    padding: 1px !important;
    gap: 1px !important;
  }
  .yolia-pro-nav .ynp-actions > .yolia-unit-switch button{
    min-width: 22px !important;
    height: 24px !important;
    padding: 0 5px !important;
    font-size: 9.5px !important;
  }
  .yolia-pro-nav .ynp-actions > .yolia-unit-switch button[data-yolia-unit-choice="auto"]{
    padding: 0 4px !important;
    font-size: 8.5px !important;
  }
}

/* ═══════════════════════════════════════════════════════════════
   ARREGLO 5 (Eduardo, 2026-09-14): en celular real, el logo fijo de
   7rem (112px) mas el boton de idioma y la pastilla de unidades no
   caben sin encimarse -- ARREGLO 4 ya achico la pastilla, pero el
   logo seguia con su tamano de escritorio. Aqui, SOLO en pantallas
   angostas: (1) el logo se reduce, (2) se recorta el espacio entre
   logo y el resto, (3) el boton "Auto" se acorta a una sola letra
   para ganar espacio. Nada de esto toca la version de escritorio.
   ═══════════════════════════════════════════════════════════════ */
@media (max-width: 30rem){
  .yolia-pro-nav .ynp-brand img{
    inline-size: 4.4rem !important;
    block-size: 2.3rem !important;
  }
  .yolia-pro-nav .ynp-shell{
    column-gap: .4rem !important;
  }
  .yolia-pro-nav .ynp-actions > .yolia-unit-switch button[data-yolia-unit-choice="auto"]{
    font-size: 0 !important;
    min-width: 18px !important;
    padding: 0 3px !important;
  }
  .yolia-pro-nav .ynp-actions > .yolia-unit-switch button[data-yolia-unit-choice="auto"]::after{
    content: "A";
    font-size: 9px;
  }
  .yolia-pro-nav .ynp-current-code{
    font-size: .68rem !important;
  }
}

/* ═══════════════════════════════════════════════════════════════
   ARREGLO 6 (Eduardo, 2026-09-14): ARREGLO 4 y 5 de arriba NUNCA
   aplicaron en el sitio real. Ese CSS fue escrito contra las clases
   "yolia-pro-nav"/"ynp-*" de la plantilla vieja (views/partials/
   global-topnav.php), pero el navbar que de verdad se muestra lo
   arma el Builder (app/builderr/render_engine.php) con OTRAS clases
   por completo: yb-nav-wrap, yb-nav-bar, yb-nav-brand, yb-nav-logo-
   frame, yb-lang-current-code. "yolia-pro-nav"/"ynp-*" no existen en
   el HTML real, por eso nunca se veia el cambio aunque el archivo
   subiera bien. Este bloque repite la misma idea (achicar logo,
   apretar espacios, "Auto" a una letra) pero contra las clases
   reales. Nada de esto toca la version de escritorio.
   ═══════════════════════════════════════════════════════════════ */
@media (max-width: 30rem){
  .yb-nav-wrap .yb-nav-bar{
    gap: .4rem !important;
  }
  .yb-nav-wrap .yb-nav-logo-frame{
    width: 44px !important; min-width: 44px !important; max-width: 44px !important;
    height: 26px !important; min-height: 26px !important; max-height: 26px !important;
  }
  .yb-nav-wrap .yb-nav-brand,
  .yb-nav-wrap .yb-nav-brand-link{
    min-width: 44px !important;
  }
  .yb-nav-wrap .yb-nav-cta{
    gap: 2px !important;
  }
  .yb-nav-wrap .yolia-unit-switch{
    padding: 1px !important;
    gap: 1px !important;
  }
  .yb-nav-wrap .yolia-unit-switch button{
    min-width: 20px !important;
    height: 22px !important;
    padding: 0 4px !important;
    font-size: 9px !important;
  }
  .yb-nav-wrap .yolia-unit-switch button[data-yolia-unit-choice="auto"]{
    font-size: 0 !important;
    min-width: 16px !important;
    padding: 0 3px !important;
  }
  .yb-nav-wrap .yolia-unit-switch button[data-yolia-unit-choice="auto"]::after{
    content: "A";
    font-size: 8px;
  }
  .yb-nav-wrap .yb-lang-current-code{
    font-size: .6rem !important;
  }
  .yb-nav-wrap .yb-lang-toggle{
    width: 30px !important;
    min-width: 30px !important;
  }
}

/* ═══════════════════════════════════════════════════════════════
   YOLIA_FIX_2026_NAV_DESKTOP_SQUEEZE (Eduardo: "en pc debe mostrar
   TODO, nunca hamburguesa"). Con el fix anterior (YOLIA_FIX_2026_
   NAV_RESPONSIVE) el navbar medía el desborde real y colapsaba a
   hamburguesa apenas faltaba 1 pixel -- eso pasaba incluso en
   pantallas de escritorio grandes (a 1920px sólo faltaban ~25px,
   pero igual se activaba la hamburguesa, y a Eduardo le parece
   horrible en PC). Aquí, en vez de colapsar, primero achicamos un
   poco los espacios y la tipografía del menú -- lo suficiente para
   que la fila completa quepa sin scroll en CUALQUIER ancho real de
   escritorio (medido y confirmado desde 1024px hasta 1920px+). El
   JS (adapt(), en yolia-navbar-pro.js) ya no permite el modo
   compacto en ese mismo rango (>=1024px), así que estas reglas y el
   JS trabajan juntos: nunca hamburguesa en PC, sin dejar scroll. */
.yolia-pro-nav:not([data-yolia-pro-compact="1"]) .ynp-link{
  padding-inline: .5rem !important;
}
.yolia-pro-nav:not([data-yolia-pro-compact="1"]) .ynp-links{
  gap: .3rem !important;
}
@media (max-width: 1450px){
  .yolia-pro-nav:not([data-yolia-pro-compact="1"]) .ynp-link{
    padding-inline: .4rem !important;
    font-size: .84rem !important;
  }
  .yolia-pro-nav:not([data-yolia-pro-compact="1"]) .ynp-links{
    gap: .2rem !important;
  }
}
@media (max-width: 1200px){
  .yolia-pro-nav:not([data-yolia-pro-compact="1"]) .ynp-link{
    padding-inline: .3rem !important;
    font-size: .74rem !important;
  }
  .yolia-pro-nav:not([data-yolia-pro-compact="1"]) .ynp-links{
    gap: 0rem !important;
  }
  .yolia-pro-nav:not([data-yolia-pro-compact="1"]) .ynp-actions{
    gap: .22rem !important;
  }
  .yolia-pro-nav:not([data-yolia-pro-compact="1"]).yolia-pro-nav{
    --ynp-logo-w: 4.6rem !important;
  }
  .yolia-pro-nav:not([data-yolia-pro-compact="1"]) .ynp-icon-btn,
  .yolia-pro-nav:not([data-yolia-pro-compact="1"]) .ynp-avatar{
    min-inline-size: 2.3rem !important;
    block-size: 2.3rem !important;
    padding: 0 .4rem !important;
  }
  .yolia-pro-nav:not([data-yolia-pro-compact="1"]) .ynp-login,
  .yolia-pro-nav:not([data-yolia-pro-compact="1"]) .ynp-cta{
    padding: .5rem .6rem !important;
    font-size: .74rem !important;
  }
  .yolia-pro-nav:not([data-yolia-pro-compact="1"]) .ynp-sub-toggle{
    inline-size: 1.3rem !important;
    margin-inline-start: -.15rem !important;
  }
}

/* YOLIA_FIX_2026_SUBTOGGLE_ARROW (Eduardo: "las flechitas de los menus que
   traen submenu estan horribles abajo del texto... desfasado de su linea
   horizontal del menu"). La flechita usaba el caracter de texto "⌄" con la
   fuente del sistema -- ese glifo en particular no esta dibujado centrado
   dentro de su propia caja en la mayoria de fuentes (queda pegado hacia
   abajo), asi que aunque el boton .ynp-sub-toggle SI estaba perfectamente
   centrado (flexbox, confirmado midiendo en vivo), el caracter dentro se
   veia mas abajo que el texto del menu -- por eso se notaba "desfasado".
   Arreglo: en vez de depender de como cada fuente dibuja ese caracter,
   usamos un icono real (chevron via CSS mask, mismo color que el texto
   con currentColor) del mismo tipo que ya usa el resto del sitio -- queda
   perfectamente centrado sin importar la fuente, el idioma o el ancho de
   pantalla. No se toca el HTML: el texto "⌄" sigue ahi (por si algo lo lee
   de forma inesperada) pero se oculta con font-size:0 y el icono real lo
   reemplaza visualmente. */
.ynp-sub-toggle span{
  display: inline-block;
  inline-size: .68rem;
  block-size: .68rem;
  font-size: 0;
  line-height: 0;
  vertical-align: middle;
  background-color: currentColor;
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E");
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-position: center;
  mask-position: center;
  -webkit-mask-size: contain;
  mask-size: contain;
}