/* Formulaire de contact COPILOF — centralisé
   Source de vérité unique. Modifier ici, pas dans les pages.
   Conçu pour fonctionner dans .cta-final (fond foncé, texte blanc)
   aussi bien en mise en page centrée (accueil) qu'en grille 2
   colonnes (.cta-grid, autres pages). */

.contact-form{
    max-width:560px;
    margin:32px auto 0;
    text-align:left;
    background:rgba(255,255,255,.06);
    border:1px solid rgba(255,255,255,.16);
    border-radius:var(--radius, 16px);
    padding:28px;
    display:flex;
    flex-direction:column;
    gap:16px;
}
.cta-grid .contact-form{
    margin:32px 0 0;
}
.cf-row{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:16px;
}
@media(max-width:520px){
    .cf-row{grid-template-columns:1fr}
}
.cf-field{
    display:flex;
    flex-direction:column;
    gap:6px;
}
.cf-field label{
    color:#fff;
    font-family:var(--fb);
    font-weight:700;
    font-size:.88rem;
}
.cf-required{
    color:#7fe0f0;
    margin-left:2px;
}
.cf-optional{
    color:#e6eef6;
    font-weight:400;
    font-size:.82rem;
}
.cf-field input,
.cf-field select,
.cf-field textarea{
    background:rgba(255,255,255,.95);
    border:1px solid transparent;
    border-radius:10px;
    padding:11px 14px;
    font-size:.95rem;
    font-family:inherit;
    color:#1e3145;
    transition:border-color .2s, box-shadow .2s;
}
.cf-field input:focus,
.cf-field select:focus,
.cf-field textarea:focus{
    outline:none;
    border-color:var(--teal, #28AEC5);
    box-shadow:0 0 0 3px rgba(40,174,197,.35);
}
.cf-field textarea{
    resize:vertical;
    min-height:90px;
}
.cf-honeypot{
    position:absolute;
    left:-9999px;
    width:1px;
    height:1px;
    opacity:0;
    pointer-events:none;
}
.cf-submit{
    align-self:flex-start;
    border:none;
}
.cf-status{
    margin:0;
    font-size:.88rem;
    font-weight:700;
    min-height:1.2em;
}
.cf-status.cf-success{color:#7fe0f0}
.cf-status.cf-error{color:#ffb3b3}