/* =========================================================
   MC Perú — UI site-wide (nav + footer modernos)
   Se enlaza en TODAS las páginas. Override del tema.
   ========================================================= */

/* =========================================================
   MC Perú — Header / Nav modern restyle (Tier-1)
   Override del tema (core.min.css). NO cambia HTML ni JS —
   misma funcionalidad (MENÚ abre overlay, LLAMAR, logo, pill).
   ========================================================= */

/* Barra superior: AZUL opaco + reflejo cristal (nunca gris) */
.headerMenu {
  background:
    linear-gradient(135deg, rgba(255, 255, 255, .13) 0%, rgba(255, 255, 255, 0) 30%),
    linear-gradient(180deg, #16337f 0%, #0b1e56 100%) !important;
  border-bottom: 1px solid rgba(130, 205, 255, .32);
  box-shadow:
    0 14px 42px rgba(0, 0, 0, .42),
    inset 0 1px 0 rgba(255, 255, 255, .18),
    inset 0 -1px 0 rgba(81, 216, 255, .14);
}
.headerMenu .menu-btn,
.headerMenu .menu-call,
.headerMenu .menu_content-logo {
  background: transparent !important;
  box-shadow: none !important;
}
/* Hover cristal en botones laterales */
.headerMenu .menu-btn:hover,
.headerMenu .menu-call:hover {
  background: linear-gradient(180deg, rgba(255, 255, 255, .12), rgba(81, 216, 255, .05)) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .18) !important;
}
.headerMenu .menu_btn-icon span { border-radius: 3px; box-shadow: 0 0 10px rgba(245, 180, 0, .45); }

/* Estado CERRAR: X + texto en dorado (visibles sobre el header cristal) */
.headerMenu .menu-btn.close-btn,
.headerMenu .menu-btn.close-btn:after,
.headerMenu .menu-btn.close-btn .close-btn-icon {
  color: #f5b400 !important;
}
.headerMenu .menu-btn.close-btn .close-btn-icon { text-shadow: 0 0 12px rgba(245, 180, 0, .5); }
.headerMenu .menu-btn.close-btn:hover:after,
.headerMenu .menu-btn.close-btn:focus:after,
.headerMenu .menu-btn.close-btn:hover .close-btn-icon,
.headerMenu .menu-btn.close-btn:focus .close-btn-icon { color: #ffce3a !important; }

/* Pill auxNav: CRISTAL con reflejo superior y glow interior */
.auxNav-list {
  background:
    linear-gradient(120deg, rgba(255, 255, 255, .16) 0%, rgba(255, 255, 255, 0) 32%),
    linear-gradient(180deg, rgba(26, 54, 122, .34), rgba(9, 20, 50, .48)) !important;
  -webkit-backdrop-filter: blur(40px) saturate(150%);
  backdrop-filter: blur(40px) saturate(150%);
  border: 1px solid rgba(140, 210, 255, .38);
  border-top: 0;
  border-radius: 0 0 22px 22px;
  box-shadow:
    0 18px 50px rgba(0, 0, 0, .45),
    inset 0 1px 0 rgba(255, 255, 255, .20),
    inset 0 0 40px rgba(81, 216, 255, .08) !important;
}
.auxNav-list li { border-left-color: rgba(120, 200, 255, .18) !important; }
.auxNav-btn {
  color: #eaf3ff !important;
  border-radius: 12px;
  transition: color .25s ease, background .25s ease, box-shadow .25s ease !important;
}
/* Hover cristal esmerilado */
.auxNav-btn:hover, .auxNav-btn:focus {
  color: #c4f2ff !important;
  background: linear-gradient(180deg, rgba(255, 255, 255, .13), rgba(81, 216, 255, .06)) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .20), 0 0 20px rgba(81, 216, 255, .22) !important;
}
.auxNav-btn:after { background-color: #51d8ff !important; box-shadow: 0 0 10px rgba(81, 216, 255, .7); }
.auxNav_btn-contact .bg {
  background: linear-gradient(90deg, #f5b400, #ffce3a) !important;
  box-shadow: 0 0 18px rgba(245, 180, 0, .38);
}
.auxNav_btn-contact:hover, .auxNav_btn-contact:focus { color: #10203a !important; }
.auxNav_btn-contact:hover, .auxNav_btn-contact:focus { background: transparent !important; box-shadow: none !important; }

/* Submenús (overlay .mainNav): columnas FROSTED CRISTAL + hover esmerilado */
.mainNav-navigation > section {
  background:
    linear-gradient(118deg, rgba(255, 255, 255, .14) 0%, rgba(255, 255, 255, 0) 30%),
    linear-gradient(180deg, rgba(255, 255, 255, .09), rgba(255, 255, 255, 0) 16%),
    linear-gradient(180deg, rgba(28, 58, 130, .26), rgba(9, 20, 50, .36)) !important;
  border-left: 1px solid rgba(140, 210, 255, .30);
  -webkit-backdrop-filter: blur(42px) saturate(155%);
  backdrop-filter: blur(42px) saturate(155%);
  box-shadow:
    inset 1px 0 0 rgba(255, 255, 255, .12),
    inset 0 1px 0 rgba(255, 255, 255, .14),
    inset -1px 0 0 rgba(140, 210, 255, .07);
}

/* Franja social (rss): cristal navy en vez de azul brillante */
.mainNav-rss {
  background:
    linear-gradient(120deg, rgba(255, 255, 255, .13) 0%, rgba(255, 255, 255, 0) 36%),
    linear-gradient(180deg, rgba(28, 58, 128, .32), rgba(9, 22, 52, .44)) !important;
  -webkit-backdrop-filter: blur(40px) saturate(150%);
  backdrop-filter: blur(40px) saturate(150%);
  border-bottom: 1px solid rgba(140, 210, 255, .32) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .20) !important;
}
.mainNav-rss li a {
  background-color: rgba(255, 255, 255, .10) !important;
  border: 1px solid rgba(150, 210, 255, .38);
  color: #dff1ff !important;
  -webkit-backdrop-filter: blur(6px);
  backdrop-filter: blur(6px);
  transition: background-color .25s ease, border-color .25s ease, transform .25s ease !important;
}
.mainNav-rss li a:hover, .mainNav-rss li a:focus {
  background-color: rgba(81, 216, 255, .24) !important;
  border-color: #51d8ff;
  color: #fff !important;
}
.mainNav-btn {
  color: #dce8ff !important;
  border-radius: 10px;
  transition: color .22s ease, background .22s ease, box-shadow .22s ease, padding-left .22s ease !important;
}
.mainNav-btn:hover, .mainNav-btn:focus {
  color: #c4f2ff !important;
  background: linear-gradient(180deg, rgba(255, 255, 255, .11), rgba(81, 216, 255, .05)) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .16), 0 0 16px rgba(81, 216, 255, .18) !important;
}
.mainNav-btn-active { color: #51d8ff !important; }

/* =========================================================
   MC Perú — Footer moderno (Tier-1). Override del tema.
   Misma funcionalidad (links, redes, volver arriba).
   ========================================================= */
.footer-1 {
  position: relative;
  background:
    linear-gradient(90deg, rgba(20, 168, 255, .07), transparent 42%),
    linear-gradient(180deg, #061838, #04122d) !important;
  border-top: 1px solid rgba(81, 216, 255, .22);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .05) !important;
}
.footer-2 { background: linear-gradient(180deg, #04122d, #050d22) !important; }
.footer-3 {
  background: #040a18 !important;
  border-top: 1px solid rgba(81, 216, 255, .10);
}

/* Redes: círculos de vidrio */
.footer_1_social-list { background-color: transparent !important; }
.footer_1_social-list .footer_1_social-btn {
  background-color: rgba(255, 255, 255, .06) !important;
  border: 1px solid rgba(130, 205, 255, .30);
  color: #cfe6ff !important;
  -webkit-backdrop-filter: blur(6px);
  backdrop-filter: blur(6px);
  transition: background-color .25s ease, border-color .25s ease, color .25s ease, transform .25s ease !important;
}
.footer_1_social-list .footer_1_social-btn:hover,
.footer_1_social-list .footer_1_social-btn:focus {
  background-color: rgba(81, 216, 255, .24) !important;
  border-color: #51d8ff !important;
  color: #fff !important;
}

/* Columnas de navegación */
.footer-2_navBtn_title { color: #51d8ff !important; letter-spacing: .04em; }
.footer-2_navBtn_title:hover, .footer-2_navBtn_title:focus { color: #ffce3a !important; }
.footer-2_navBtn { color: rgba(222, 234, 255, .82) !important; }
.footer-2_navBtn:hover, .footer-2_navBtn:focus { color: #51d8ff !important; }

/* Legal / país / copyright / divisor */
.footer-2_navList-legal li a { color: rgba(184, 204, 234, .70) !important; }
.footer-2_navList-legal li a:hover, .footer-2_navList-legal li a:focus { color: #51d8ff !important; }
.footer-2_Pais { color: rgba(184, 204, 234, .70) !important; }
.footer-2_copyright { color: rgba(184, 204, 234, .62) !important; }
.footer-2_divider {
  background: linear-gradient(90deg, transparent, rgba(81, 216, 255, .42), transparent) !important;
  height: 1px !important;
}

/* Botón "volver arriba" en cristal cian */
.footer-elevator {
  background: linear-gradient(180deg, rgba(20, 42, 100, .55), rgba(8, 18, 46, .66)) !important;
  border-left: 1px solid rgba(81, 216, 255, .24) !important;
  -webkit-backdrop-filter: blur(10px);
  backdrop-filter: blur(10px);
  color: #51d8ff !important;
}
.footer-elevator:before { color: #86bce8 !important; }
.footer-elevator:hover, .footer-elevator:focus { background: rgba(81, 216, 255, .18) !important; color: #fff !important; }
.footer-elevator:hover:before, .footer-elevator:focus:before { color: #fff !important; }

/* Crédito ClickFast */
.footer-3 .clickfast-credit { color: rgba(200, 214, 240, .5) !important; }

/* =========================================================
   MC Perú — menubar estilo HUD (líneas + luces cian)
   Igual que las tarjetas del portafolio.
   ========================================================= */
/* Pill: glow de luces + halo cian */
.auxNav-list {
  box-shadow:
    0 18px 50px rgba(0, 0, 0, .45),
    inset 0 1px 0 rgba(255, 255, 255, .20),
    inset 0 0 40px rgba(81, 216, 255, .10),
    0 0 34px rgba(81, 216, 255, .16) !important;
}
/* Submenús: esquinas HUD (líneas) + luz cian por columna */
.mainNav-navigation > section { position: relative; }
.mainNav-navigation > section::after {
  content: "";
  position: absolute;
  inset: 14px;
  pointer-events: none;
  border: 1px solid rgba(120, 210, 255, .5);
  border-radius: 12px;
  opacity: .45;
  -webkit-mask:
    linear-gradient(#000, #000) top left / 24px 24px no-repeat,
    linear-gradient(#000, #000) top right / 24px 24px no-repeat,
    linear-gradient(#000, #000) bottom left / 24px 24px no-repeat,
    linear-gradient(#000, #000) bottom right / 24px 24px no-repeat;
  mask:
    linear-gradient(#000, #000) top left / 24px 24px no-repeat,
    linear-gradient(#000, #000) top right / 24px 24px no-repeat,
    linear-gradient(#000, #000) bottom left / 24px 24px no-repeat,
    linear-gradient(#000, #000) bottom right / 24px 24px no-repeat;
}