*{
    margin:0;
    padding:0;
    box-sizing: border-box;
    list-style: none;
    font-family: Roboto;
    list-style:none;
    text-decoration: none;
}


header{display: flex;
    justify-content: space-between;
    align-items:center;
    box-shadow: 0px 0px 10px rgba(158, 153, 153, 0.8), inset 0px 0px 10px rgba(255, 255, 255, 0.5);
   }

header ul{display:flex;
        justify-content: space-between;
        }
header ul li{
    margin:30px;
    color:#003D64;
    text-transform: uppercase;
    font-weight: 600;
}

main{display: flex;
    flex-direction: column;
justify-content: center;
align-items: center;}

main .title{
    display:flex;
    justify-content:center;
    align-items:center;
    flex-direction: column;
    margin:100px auto;
}

form{display: flex;
    justify-content: center;
    align-items: center;
    background-color: rgba(110, 110, 110, 0.301);
    box-shadow: 0px 0px 10px rgba(158, 153, 153, 0.8), inset 0px 0px 10px rgba(255, 255, 255, 0.5);
border-radius: 10px;
padding:10px;}

form input{margin:15px;
width:300px;
height:35px;
border:none;
padding-left:5px;
border-radius:5px;
outline: none;}

form input::placeholder { 
    color: #003D64;
  }

.pesquisar{
    background-color: #FFA500;
    color:white;
    border:none;
    width:180px;
    height:35px;
    border-radius: 10px;

}



/* Adicione transições suaves */
.product-card {
    transition: transform 0.3s ease;
}

/* Otimize para touch */
button, a {
    min-width: 44px;
    min-height: 44px;
}

/* Esconda elementos não essenciais em mobile */
@media (max-width: 480px) {
    .desktop-only {
        display: none!important;
    }
}