/* Menu base styles - ensures header is above content and submenus don't overlap logos */
.header-upper{
  z-index:9999;
  position:relative;
  /* Fondo semitransparente para mejorar contraste sobre imágenes */
  background: rgba(0,0,0,0.45);
  -webkit-backdrop-filter: blur(4px);
  backdrop-filter: blur(4px);
  border-bottom: 1px solid rgba(255,255,255,0.03);
}

.header-upper .inner-container{display:flex;align-items:center;justify-content:space-between;max-width:1600px;margin:0 auto;padding:0 8px;height:72px}
.logo-box .logo img{max-height:40px;width:auto}
.nav-outer{flex:1;display:flex;justify-content:center}
.main-menu{width:100%;max-width:1080px}
.navigation{display:flex;gap:2px;align-items:center;justify-content:center;list-style:none;margin:0;padding:0;white-space:nowrap}
.navigation>li{position:relative}
.navigation>li>a{display:inline-block;padding:6px 8px;font-size:13px;font-weight:600;color:#fff;text-transform:uppercase;letter-spacing:0.2px}

/* Submenu */
.navigation li ul{position:absolute;top:calc(100% + 8px);left:0;min-width:200px;background:rgba(255,255,255,0.98);color:#222;border-radius:6px;box-shadow:0 12px 30px rgba(0,0,0,0.15);visibility:hidden;opacity:0;transform:translateY(6px);transition:all .22s ease;z-index:10000}
.navigation li:hover>ul{visibility:visible;opacity:1;transform:translateY(0)}
.navigation li ul li{padding:0}
.navigation li ul li a{display:block;padding:10px 14px;color:#222;font-weight:500;text-transform:none}
.navigation li ul li a:hover{background:#f5f7fa}

.other-links{display:flex;align-items:center;gap:12px}
.phone-link{color:#fff;font-size:18px}
.transparency-link img{height:28px; width:auto; display:block}
.transparency-link{display:flex;align-items:center;padding-left:6px}


/* Ensure header content is readable on top of hero images */
.page-banner ~ .page-wrapper .header-upper .navigation>li>a,
.header-upper .navigation>li>a{ text-shadow:0 2px 6px rgba(0,0,0,0.45) }

@media(max-width:1200px){
  .navigation>li>a{font-size:13px;padding:8px 10px}
}

@media(max-width:991px){
  /* Allow wrapping on small screens and show mobile toggler */
  .nav-outer{display:none}
  .mobile-nav-toggler{display:block}
  .logo-box .logo img{max-height:40px}
}