.contenedor{
width: 100%;
margin: auto;
box-sizing: border-box;
border: 1px solid;
font-family:Arial, Helvetica, sans-serif;
}

header{
width: 0;  
padding: 0;
flex-wrap: wrap;
}

nav{
display:flex;
justify-content: space-between;
text-align: center;
flex-wrap: wrap;
align-items: center;
}
nav.menu{
align-items: center;
}

nav img{
width: 60px;
margin-left: 20px;
}

nav a{
text-decoration: none;
font-size:18px;
font-weight:bold;
color: black;
padding-right: 50px;
cursor: pointer;
}

nav a:hover{
text-decoration: underline;
}

/* ----- Estilos generales del carrusel ----- */
#carouselExample {
max-width: 100%;           /* Ancho máximo del carrusel */
margin: auto;          /* Centra el carrusel horizontalmente */
overflow: hidden;           /* Evita que las imágenes sobresalgan */
box-shadow: 0 4px 15px rgba(0, 0, 0, 0.3); /* Sombra sutil */
}

/* ----- Estilos para las imágenes ----- */
.carousel-inner img {
width: 100%;
height: 540px;              /* Altura fija (puedes ajustarla) */
object-fit: cover;          /* Recorta las imágenes sin distorsionar */
transition: transform 0.6s ease-in-out; /* Efecto suave al cambiar */
}

/* ----- Botones de control (prev y next) ----- */
.carousel-control-prev-icon,
.carousel-control-next-icon {
background-color: rgba(0, 0, 0, 0.6); /* Fondo oscuro semitransparente */
border-radius: 50%;
padding: 20px;
background-size: 50%, 50%;
}

.carousel-control-prev,
.carousel-control-next {
width: 5%;
}

.carousel-control-prev:hover .carousel-control-prev-icon,
.carousel-control-next:hover .carousel-control-next-icon {
  background-color: rgba(0, 0, 0, 0.8); /* Más oscuro al pasar el mouse */
}

/* ----- Ajustes para pantallas pequeñas ----- */
@media (max-width: 768px) { 
#carouselExample {
    max-width: 100%;
}

.carousel-inner img {
    height: 300px;
}

}

.bar {
background:rgba(32, 92, 20) ; /* Degradado azul vibrante */
color: #fff;
text-align: center;
padding: 60px 20px;
width: 100%;
box-shadow: 0 4px 20px rgba(0, 0, 0, 0.2);
}

.bar h2 {
font-size: 2rem;
margin-bottom: 25px;
font-weight: 600;
letter-spacing: 1px;
}

/* ----- Botón principal ----- */
.boton {
background-color: #000000;
border: none;
border-radius: 5px;
padding: 10px 20px;
transition: all 0.3s ease;
cursor: pointer;
}

.boton a {
text-decoration: none;
color: #ffffff;
font-weight: 600;
font-size: 1.1rem;
}

/* Efectos hover */
.boton:hover{
background-color: #ffffff;
color: #000000;
}

.boton:hover a {
color: #000000;
}

.comentarios{
background-color: rgba(32, 92, 20,0.6);
width: 100%;
border:2px solid rgba(32, 92, 20,0.0);
}

.testimonios h2{
text-align: center;
font-size:50px;
font-weight: bold;
margin-top: 20px;
margin-bottom: 0;
}
.cards{
display: flex;
flex-wrap: wrap;
justify-content:center;
}
.carta1{
align-items: center;
background-color: white;
border-radius: 7px;
width: 300px;
height: auto;
padding: 15px;
margin: 30px;
}

.carta1 p{
margin: 20px;
text-align: start;
}

footer{
    border:none;
    display: flex;
    justify-content:space-between;
    align-items: center;
    flex-wrap: wrap;
    margin-top:20px ;
}

footer p{
    font-size: 20px;
    margin-left: 38%;
}

#redes-sociales{ 
    padding: 10px;

}


#redes-sociales a{
    text-decoration: none;
    padding: 10px;
}