/* =========================================================
   ÍNDICE · HEADER / NAVBAR
   =========================================================

   01. Navbar · Base y diseño general
   02. Logo · Tamaños y estados
   03. Menú · Links y estados
   04. Menú · Subrayado activo
   05. Botón hamburguesa
   06. Navbar · Estado shrink
   07. Navbar · Responsive
   08. Ajustes de espaciado (hero / slider)

   ========================================================= */


/* =========================================================
   01. NAVBAR · BASE Y DISEÑO GENERAL
========================================================= */

.navbar-tech {
  background-color: #ffffff;
  border-bottom: 1px solid #d1d5db; /* línea gris */
  padding-top: 1rem;
  padding-bottom: 1rem;
  transition:
    padding 0.3s ease,
    box-shadow 0.3s ease,
    background-color 0.3s ease;
}


/* =========================================================
   02. LOGO · TAMAÑOS Y ESTADOS
========================================================= */

.logo-header {
  max-height: 48px;
  width: auto;
  display: block;
  transition: max-height 0.3s ease;
}

/* Logo al hacer shrink */
.navbar-tech.navbar-shrink .logo-header {
  max-height: 38px;
}


/* =========================================================
   03. MENÚ · LINKS Y ESTADOS
========================================================= */

.navbar-tech .navbar-nav .nav-link {
  color: #000000;
  font-weight: 500;
  padding: 0.5rem 0;
  margin-left: 1.5rem;
  position: relative;
  transition: color 0.2s ease; /* solo color */
}

/* Hover */
.navbar-tech .navbar-nav .nav-link:hover {
  color: #0d6efd;
}

/* Enlace activo */
.navbar-tech .navbar-nav .nav-link.active {
  color: #0d6efd;
  font-weight: 600;
}


/* =========================================================
   04. MENÚ · SUBRAYADO SOLO ACTIVO
========================================================= */

.navbar-tech .navbar-nav .nav-link::after {
  content: '';
  position: absolute;
  left: 0;
  bottom: -6px;
  width: 100%;
  height: 2px;
  background-color: #0d6efd;
  display: none; /* oculto por defecto */
}

.navbar-tech .navbar-nav .nav-link.active::after {
  display: block;
}


/* =========================================================
   05. BOTÓN HAMBURGUESA
========================================================= */

.navbar-tech .navbar-toggler {
  border-color: rgba(0,0,0,0.2);
}

.navbar-tech .navbar-toggler-icon {
  filter: invert(1);
}


/* =========================================================
   06. NAVBAR · ESTADO SHRINK
========================================================= */

.navbar-tech.navbar-shrink {
  padding-top: 0.4rem;
  padding-bottom: 0.4rem;
  box-shadow: 0 6px 20px rgba(0,0,0,0.08);
}


/* =========================================================
   07. NAVBAR · RESPONSIVE
========================================================= */

@media (max-width: 991px) {

  .navbar-tech .navbar-collapse {
    background: #ffffff;
    padding: 1rem 1.5rem;
  }

  .navbar-tech .navbar-nav .nav-link {
    margin-left: 0;
    padding: 0.75rem 0;
  }

  .navbar-tech .navbar-nav .nav-link::after {
    bottom: -2px;
  }
}


/* =========================================================
   08. AJUSTES DE ESPACIADO (HERO / SLIDER)
   (Se mantiene por compatibilidad con el layout actual)
========================================================= */

.hero,
.hero-slider {
  margin-top: 72px;
}

/* Cuando el navbar se reduce */
.navbar-tech.navbar-shrink ~ .hero,
.navbar-tech.navbar-shrink ~ .hero-slider {
  margin-top: 56px;
}

/* Responsive */
@media (max-width: 768px) {

  .logo-header {
    max-height: 44px;
  }

  .navbar-tech.navbar-shrink .logo-header {
    max-height: 34px;
  }

  .hero,
  .hero-slider {
    margin-top: 64px;
  }

  .navbar-tech.navbar-shrink ~ .hero,
  .navbar-tech.navbar-shrink ~ .hero-slider {
    margin-top: 52px;
  }
}


/* ===================== IDIOMAS NAVBAR ===================== */

.nav-idiomas{
display:flex;
align-items:center;
gap:8px;
margin-left:15px;
}

.bandera{
display:flex;
align-items:center;
}

.bandera img{
width:22px;
height:16px;
border-radius:2px;
transition:transform .2s ease, opacity .2s ease;
cursor:pointer;
}

.bandera img:hover{
transform:scale(1.15);
opacity:0.9;
}

/* ===================== OCULTAR GOOGLE TRANSLATE ===================== */

.goog-te-banner-frame.skiptranslate{
display:none !important;
}

body{
top:0 !important;
}

/* evita fondo amarillo al traducir */
.goog-text-highlight{
background:none !important;
box-shadow:none !important;
}

/* oculta tooltip */
.goog-tooltip{
display:none !important;
}

/* evitar espacio que deja google translate */

body{
top:0 !important;
margin-top:0 !important;
padding-top:0 !important;
}

.goog-te-banner-frame.skiptranslate{
display:none !important;
}

.skiptranslate{
display:none !important;
}

iframe.goog-te-banner-frame{
display:none !important;
}