.carousel-container {
  transform: translateX(0);
}

.carousel-btn:hover {
  transform: translateY(-50%) scale(1.1);
}

.carousel-indicator {
  border: 2px solid #444;
}

.carousel-indicator.active {
  background-color: white !important;
  opacity: 1 !important;
  transform: scale(1.2);
  border-color: #444;
}

.carousel-indicator:hover {
  transform: scale(1.1);
}

/* Scroll suave para navegación interna */
html {
  scroll-behavior: smooth;
}

/* Estilos para header sticky que se encoge */
#header {
  transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
  will-change: transform, padding, background-color;
}

#header.header-scrolled {
  padding: 0.5rem 0;
  background-color: rgba(229, 231, 235, 0.95);
  backdrop-filter: blur(10px);
  transform: translateY(0);
}

#header.header-scrolled img {
  height: 3rem;
  padding: 0.5rem;
  transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
}

#header.header-scrolled ul li {
  padding: 0.75rem 1.25rem;
  transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
}

#header.header-scrolled ul li a {
  font-size: 1rem;
  transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
}

/* Responsive para header encogido en móviles */
#header.header-scrolled img {
  height: 2.5rem;
  padding: 0.25rem;
}

@media (max-width: 768px) {
  #header.header-scrolled img {
    height: 2rem;
    padding: 0.25rem;
  }
  
  #mobile-menu {
    max-height: calc(100vh - 4rem);
    overflow-y: auto;
  }
}

/* Ajuste dinámico del scroll margin para secciones */
#quienesSomos {
  scroll-margin-top: 8rem; /* 32 * 0.25rem = 8rem para header completo */
}

/* Cuando el header está encogido, reducir el scroll margin */
#header.header-scrolled ~ #quienesSomos,
#header.header-scrolled ~ * #quienesSomos {
  scroll-margin-top: 6rem; /* Menos espacio cuando el header está encogido */
} 

.bg-valores {
  background-image: url('./assets/imagen07.png');
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
} 

.bg-valores-overlay {
  background: rgba(55, 65, 81, 0.7); /* gris-700 con 70% opacidad */
} 