@import url('https://fonts.googleapis.com/css2?family=Lato:ital,wght@0,100;0,300;0,400;0,700;0,900;1,100;1,300;1,400;1,700;1,900&family=Montserrat:ital,wght@0,100..900;1,100..900&family=Nunito+Sans:ital,opsz,wght@0,6..12,200..1000;1,6..12,200..1000&family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&family=Raleway:ital,wght@0,100..900;1,100..900&display=swap');
        
html {
    scroll-padding-top: 80px; /* Ajusta esto según la altura de tu navbar */
    scroll-behavior: smooth;
  }
.navbar {
    position: sticky;
    top: 0;
    z-index: 999;
    transition: background-color 0.3s ease-in-out;
}

.navbar.scrolled {
    background-color: #000; /* Fondo oscuro cuando la navbar está en uso */
}

.navbar-brand img {
    margin: 0;
    padding: 0;
    max-height: 60px;
    width: auto;
}

.navbar-collapse {
    background-color: #000; /* Fondo oscuro en el menú desplegable */
}

.hero-section {
    padding-top: 80px; /* Ajustar para que el hero no quede tapado por la navbar */
}

.navbar-brand img {
    margin: 0;
    padding: 0;
    max-height: 60px; 
    width: auto;/* Mantiene la proporción del logo */
  }


/* Estilos para el carrusel */
section.container-fluid.py-5.bg-light {
    padding-bottom: 0 !important;
    margin-bottom: 0 !important;
}
  #carouselExampleIndicators {
    max-height: 300px;  /* Ajusta la altura del carrusel como desees */
    overflow: hidden;  /* Evita que el contenido se desborde */
    margin-bottom: 0 !important;
    padding-bottom: 0 !important;
}

#carouselExampleIndicators .carousel-item img {
    object-fit: cover;  /* Asegura que la imagen cubra el espacio sin deformarse */
    height: 100%;  /* Hace que las imágenes cubran toda la altura del contenedor */
}

.carousel-item img {
  width: 100%;
  height: 400px; /* o la altura fija que uses para el carrusel */
  object-fit: cover; /* para que la imagen escale bien sin deformarse */
  display: block;
}

.carousel-indicators li {
  cursor: pointer;
}

.carousel-inner {
  cursor: default; /* el cursor normal fuera de los indicadores */
}

/*Estilos de fuentes*/
.ft-Raleway{
    font-family: Raleway, sans-serif;
    font-weight: 400;
}

.ft-lato{
    font-family: Lato, sans-serif;
    font-weight: 400;
}

.ft-Montserrat{
    font-family: Montserrat, sans-serif;
    font-weight: 400;
}

.ft-Nunito-Sans{
    font-family: 'Nunito Sans', sans-serif;
    font-weight: 400;
}

.ft-Poppinst{
    font-family: 'Poppins', sans-serif;
    font-weight: 400;
}

.img-limit {
    max-height: 250px;
    object-fit: cover;
  }

  footer {
    width: 100%;
    position: relative;
    left: 0;
    right: 0;
    bottom: 0;
}
.justificado {
    text-align: justify;
  }
  
  .btn-primary {
    background-color: #373A36 !important;
    border-color: #373A36 !important;
  }
  
  .btn-primary:hover {
    background-color: #4d4d4d !important;
    border-color: #4d4d4d !important;
  }
  .btn-primary:focus {
    background-color: #2a2f3a !important;
    border-color: #2a2f3a !important;
  }

.btn-success svg {
  vertical-align: middle;
  color: white;
}
.decorative-line {
  border-top: 2px solid #000;
  width: 90%;
}