/* Confirmation affichée après l'envoi d'un formulaire (Netlify).
   Fichier ajouté en dehors de l'export Webflow.

   Webflow fournit déjà .success-message / .error-message (fond, rayon,
   centrage). On ajoute ici la pastille d'icône, le titre et la place
   nécessaire pour que la section ne se vide pas quand le formulaire
   disparaît. */

.form-feedback {
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: var(--_spacing---space-1-small, 0.75rem);
  padding: var(--_spacing---space-2-small, 2rem) 1rem;
  display: flex;
}

.form-feedback:before {
  content: "\2713";
  width: 3.5rem;
  height: 3.5rem;
  color: var(--_color---3b7ac9, #20b932);
  background: var(--_color---white, #fff);
  border-radius: 50%;
  flex: none;
  justify-content: center;
  align-items: center;
  font-size: 1.75rem;
  line-height: 1;
  display: flex;
}

.error-message .form-feedback:before {
  content: "\0021";
  color: #c0392b;
}

.form-feedback-title {
  font-family: var(--inter, Inter, sans-serif);
  font-size: 1.5rem;
  font-weight: 600;
  line-height: 1.3em;
}

.form-feedback-text {
  font-family: var(--inter, Inter, sans-serif);
  max-width: 26rem;
  font-size: 1rem;
  line-height: 1.5em;
}

/* Formulaire de contact : le message reprend la hauteur du formulaire
   pour que la colonne de droite garde sa forme. */
.contact-form.w-form .form-feedback {
  min-height: 20rem;
}

/* Footer : version compacte, elle remplace un simple champ email. */
.footer-form.w-form .form-feedback {
  gap: 0.5rem;
  padding: 1rem;
}

.footer-form.w-form .form-feedback:before {
  width: 2rem;
  height: 2rem;
  font-size: 1rem;
}

.footer-form.w-form .form-feedback-title {
  font-size: 1.125rem;
}

.footer-form.w-form .form-feedback-text {
  font-size: 0.9375rem;
}

@media screen and (max-width: 767px) {
  .contact-form.w-form .form-feedback {
    min-height: 14rem;
  }

  .form-feedback-title {
    font-size: 1.25rem;
  }
}