h1,h2{
    margin:30px 40px 10px;
}

main{
    width:90%;
    margin:auto;
}

/* Plats */

.cards{
    display:flex;
    justify-content:center;
    align-items:stretch;
    gap:20px;
    flex-wrap:wrap;
    margin:20px 0 40px;
}

.card{
    width:250px;
    background:#fff;
    border-radius:12px;
    overflow:hidden;
    box-shadow:0 4px 10px rgba(0,0,0,.1);
    transition:.3s;
}

.card:hover{
    transform:translateY(-10px);
}

.image-container img{
    width:100%;
    height:180px;
    object-fit:cover;
}

.card-content{
    padding:15px;
}

.pieces{
    color:#111;
    font-size:14px;
    margin:5px 0 10px;
}

.bottom{
    display:flex;
    justify-content:space-between;
    align-items:center;
}

.price{
    font-weight:bold;
}

.add{
    background:#BC002D;
    color:#fff;
    border:none;
    padding:6px 12px;
    border-radius:50%;
    cursor:pointer;
}

.add:hover{
    background:#b8001c;
}

/* trait*/

hr{
    color:#BC002D;
    background:#BC002D;
}

/* Allergènes */

.allergy-filter{
    width:100%;
    margin:auto;
    background:#1b1b1b;
    padding:3px 0;
    text-align:center;
    border-top:2px solid #c4002f;
    border-bottom:2px solid #c4002f;
}

.allergy-options{
    display:flex;
    flex-wrap:wrap;
    justify-content:center;
    gap:6px;
    
}

.allergy-item span{
    display:inline-block;
    padding:4px 8px;
    border:2px solid #c4002f;
    border-radius:20px;
    color:#c4002f;
    font-weight:bold;
    font-size:12px;
    transition:0.25s;
    background:transparent;
}

.allergy-item span:hover{
    background:#c4002f;
    color:white;
}

.allergy-item input:checked + span{
    background:#c4002f;
    color:white;
    box-shadow:0 0 6px rgba(196,0,47,0.7);
}

.allergy-item input[type="checkbox"]{
    display:none;
}

.filter-btn{
    background:#c4002f;
    color:white;
    border:none;
    padding:6px 14px;
    font-size:13px;
    border-radius:6px;
    cursor:pointer;
    opacity:0;
    transition:0.3s;

}
    
.filter-btn:hover{
    background:#a00025;
    transform:scale(1.03);
}

.allergy-filter:hover .filter-btn{
    opacity:1;
}