body{
background:#f4f6f8;
font-family:Segoe UI, sans-serif;
}

.navbar{
background:#0f172a !important;
}

.hero{
height:520px;

background:
url('../img/banners/To Do Inox.jpg'); /* SOLO fondo */

background-size:cover;
background-position:center;

display:flex;
justify-content:center; /* vertical */
align-items:flex-end;    /* horizontal */
text-align:center;
padding-bottom:30px;
}

.hero h1{
margin-bottom:20px;
background: rgba(255,255,255,0.6);
color:#0b1f3a; 
font-weight:700;
}

.hero p{
color:#1a1a1a;
background: rgba(255,255,255,0.6);
display:inline-block;
border-radius:5px;
text-shadow: 1px 1px 3px rgba(255,255,255,0.5);
}


.btn-primary{
background: linear-gradient(135deg, #0d3b66, #1b6ca8);
border:none;
color:#fff;
}

.btn-primary:hover{
background: linear-gradient(135deg, #1b6ca8, #0d3b66);
}

.btn-outline-light{
color:#0d3b66;
border:2px solid #0d3b66;
background:#ffffffcc;
}

.btn-outline-light:hover{
background:#0d3b66;
color:#fff;
}

.product-card{

transition:0.3s;

}

.product-card:hover{

transform:scale(1.04);

}

.footer{

padding:40px 0;

}

.social-icon{

color:white;

font-size:22px;

margin-right:15px;

}

/* Logo in navbar */
.navbar-logo{
	height:40px;
	width:auto;
	display:inline-block;
}

@media (max-width:576px){
	.navbar-logo{ height:32px; }
}


.product-card{

border-radius:15px;
overflow:hidden;
transition:0.3s;

}

.product-card img{

height:220px;
object-fit:cover;

}

.product-card:hover{

transform:translateY(-8px);
box-shadow:0 10px 25px rgba(0,0,0,0.2);

}

button{

border-radius:10px;

}

input{

border-radius:10px !important;

}

#carritoFloat{

position:fixed;
bottom:20px;
left:20px;

background:#0f172a;
color:white;

width:60px;
height:60px;

border-radius:50%;

display:flex;
align-items:center;
justify-content:center;

font-size:22px;

cursor:pointer;

box-shadow:0 4px 15px rgba(0,0,0,0.3);

}

#contadorCarrito{

position:absolute;
top:-5px;
right:-5px;

background:red;

width:20px;
height:20px;

border-radius:50%;

font-size:12px;

display:flex;
align-items:center;
justify-content:center;

}

.cantidadInput{
border-radius:8px;
text-align:center;
}

.modal-body{
max-height:400px;
overflow-y:auto;
}

.product-card img{
height:220px;
object-fit:cover;
}