/* Paleta de Colores y Estilos Personalizados para Ajoloteria */

body {
    background-color: #F0F8F7; /* Un fondo muy claro, como un verde menta pálido */
    color: #333333;
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
}

/* Estilo para la barra de navegación */
.navbar {
    background-color: #ffffff !important; /* Fondo blanco para que resalte */
    border-bottom: 3px solid #3E8A86; /* Borde inferior con el color primario */
}

.navbar-brand, .nav-link {
    color: #3E8A86 !important; /* Color primario para los textos de la navegación */
    font-weight: bold;
}

.nav-link:hover {
    color: #E57373 !important; /* Color de acento al pasar el ratón */
}

/* Estilo para los encabezados */
h1, h2, h3, h4, h5 {
    color: #3E8A86; /* Color primario para todos los encabezados */
}

/* Estilo para los botones */
.btn-primary {
    background-color: #E57373;
    border-color: #E57373;
}

.btn-primary:hover {
    background-color: #D36A6A;
    border-color: #D36A6A;
}

/* Estilo para las imágenes de las tarjetas */
.card-img-top {
    height: 200px; /* Altura fija para todas las imágenes de las tarjetas */
    object-fit: cover; /* Asegura que la imagen cubra el espacio sin deformarse */
}

/* Estilo para las imágenes del carrusel */
.carousel-item img {
    height: 600px; /* Altura ajustada para el nuevo diseño de dos columnas */
    object-fit: cover; /* Asegura que la imagen cubra el espacio sin deformarse */
}

/* Estilo para las leyendas del carrusel */
.carousel-caption {
    background-color: rgba(0, 0, 0, 0.5); /* Fondo negro semitransparente */
    border-radius: .5rem; /* Bordes redondeados */
    padding: 1rem;
}

/* Estilo para los créditos del pie de página */
.footer-credits {
    font-size: 0.8rem; /* Tamaño de fuente más pequeño */
    line-height: 1.2; /* Espacio entre líneas reducido */
}