body{
    font-family: Arial, sans-serif;
    margin: 0;
    color: #333;
    background-color: #e9dfd0;
}

.container{
    max-width:1100px;
    margin:auto;
    padding:50px 20px;
}

.hero{
    background:
        linear-gradient(rgba(0,0,0,0.45), rgba(0,0,0,0.45)),
        url('assets/fond-entete.png');
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    color:#fff;
    text-align:center;
    padding:120px 20px;
}
.btn{
    background:#b87428;
    color:#fff;
    padding:14px 24px;
    border-radius:6px;
    text-decoration:none;
}

.cards{
    display:grid;
    grid-template-columns:repeat(auto-fit,minmax(220px,1fr));
    gap:20px;
}

.card,.ph{
    background:#fff;
    padding:30px;
    border-radius:8px;
    box-shadow:0 2px 8px rgba(0,0,0,.1);
}

.gallery{
    display:grid;
    grid-template-columns:repeat(auto-fit,minmax(200px,1fr));
    gap:20px;
}

.contact a{
    text-decoration:none;
    color:#b87428;
}

footer{
    background:#222;
    color:#fff;
    text-align:center;
    padding:20px;
}

.chantier{
    margin-bottom:50px;
}

.comparaison{
    display:flex;
    gap:20px;
    flex-wrap:wrap;
}

.comparaison div{
    flex:1;
    min-width:300px;
}

.comparaison img{
    width:100%;
    border-radius:8px;
}