/* Estilos Generales */
body {
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
    background: linear-gradient(to right, #cfd9df 50%, #e2ebf0 50%);
        /* Colores de fondo izquierdo y derecho */
    color: #555;
}

.container {
    margin-top: 60px;
}

/* Barra de Navegación */
.navbar {
    background-color: lightgoldenrodyellow;
    /* Melocotón claro */
    border-bottom: 1px solid #ff7f50;
    /* Borde salmón claro */
    padding: 1px;
    /* Ajuste de relleno para hacerla menos ancha */
}

.navbar-logo-container img {
    height: 30px;
    /* Reducción de la altura del logo */
    margin-right: 10px;
    
}

.navbar-brand {
            font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
            font-size: 35px;
            color: #17a2b8;
            letter-spacing: 2px;
            text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.1);
            position: absolute;
            left: 50%;
            top: 50%;
            transform: translate(-50%, -50%);
                

}
.navbar-center {
    display: flex;
    justify-content: center;
    align-items: center;
    height: 100%;
}

.navbar-nav .nav-link {
    color: #4d4d4d;
    /* Gris oscuro */
}

.navbar-nav .nav-link:hover {
    color: #ff7f50;
    /* Salmón claro */
}
.navbar-brand mx-auto {
    margin-top: 20px;
}

/* Encabezado */
#home {
    padding: 125px 0;
    background-color: white;
    /* Gris claro */
}

#wisoul-logo {
    height: 100px;
}

.display-4 {
    color: #ff7f50;
    /* Salmón claro */
    font-size: 2.5rem;
    /* Aumento del tamaño del título */
   
}

/* Productos */
#productos {
    padding: 60px 0;
    background-color: #fff;
    /* Blanco */
}

 .card {
     border: none;
     border-radius: 10px;
     overflow: hidden;
     box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
     transition: transform 0.3s;
 }

 .card:hover {
     transform: scale(1.05);
 }

 .card-img-top {
     border-bottom: 1px solid #dee2e6;
 }

 .card-body {
     padding: 1.25rem;
 }

 .card-title {
     font-size: 1.25rem;
     font-weight: bold;
 }

 .card-text {
     color: #6c757d;
 }

.card img {
    max-height: 250px;
    /* Aumento de la altura máxima de la imagen dentro de la card */
    object-fit: cover;
    /* Ajuste de la imagen para cubrir la card */
}

/* Añadir espacio entre las cards */
#productos .card {
    margin-bottom: 30px;
}

/* Sobre Nosotros */
#about {
    padding: 60px 0;
    background-color: #e6f7ff;
    /* Azul claro */
}

/* Contacto */
#contact {
    padding: 60px 0;
    background-color: #fff;
    /* Blanco */
}
 
/* Pie de Página */
footer {
    background-color: #ffd6c5;
    /* Melocotón claro */
    color: #4d4d4d;
    /* Gris oscuro */
    padding: 20px 0;
}