#contact-form {
    display: flex;
    flex-direction: column;
    gap: 24px;
    max-width: 100%;
}

.champ { display: flex; flex-direction: column; gap: 8px; border: 0; padding: 0; margin: 0; }
.champs-pro { display: flex; flex-direction: column; gap: 24px; }
.champs-pro[hidden] { display: none; }

#contact-form label,
#contact-form legend { font-weight: normal; }

#contact-form input[type="text"],
#contact-form input[type="email"],
#contact-form textarea,
#contact-form input[type="file"] {
    font: inherit;
    color: var(--black);
    background: var(--white);
    border: var(--border) solid var(--black);
    padding: 10px;
    width: 100%;
    box-sizing: border-box;
    border-radius: 0;
}

#contact-form textarea { resize: vertical; }

#contact-form input:focus-visible,
#contact-form textarea:focus-visible {
    outline: 3px solid var(--jaune);
    outline-offset: 2px;
}

/* Choix Pro / Particulier : deux "boutons" */
.choix { flex-direction: row; flex-wrap: wrap; gap: 12px; }
.choix legend { width: 100%; margin-bottom: 8px; }
.choix label { flex: 1; min-width: 140px; cursor: pointer; }
.choix input { position: absolute; opacity: 0; pointer-events: none; }
.choix span {
    display: block;
    text-align: center;
    padding: 10px;
    border: var(--border) solid var(--black);
    background: var(--white);
    transition: 0.2s;
}
.choix input + span:hover{font-family: "BOURRASQUE EST";}
.choix input:checked + span { background: var(--black); color: var(--white); font-family: "BOURRASQUE EST";}
.choix input:focus-visible + span { outline: 3px solid var(--jaune); outline-offset: 2px; }

.consentement { display: flex; gap: 10px; align-items: flex-start; font-weight: normal !important; }
.consentement input { margin-top: 4px; flex: none; }

/* Piège à robots */
.piege { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }

.form-statut { margin: 0; min-height: 1.5em; }
.form-statut.is-ok     { color: var(--black); }
.form-statut.is-erreur { color: var(--orange); }