/**
 * Section Contact Form / CTA Form
 * Layout uniquement - les styles des éléments utilisent les patterns atomiques
 * Mobile-first responsive design
 */

/* Section uses .section-padding utility class from _utility.css */

.s-contact-form {
  width: 100%;
}

/* Background wrapper with purple gradient - uses utility class .bg-gradient-purple */

.s-contact-form__bg {
  overflow: hidden;
  height: auto;
  padding: 2.5rem 1.25rem;
  background-position: center;
  background-size: cover;
}

@media all and (min-width: 769px) {

.s-contact-form__bg {
    min-height: 30rem;
    padding: 2.5rem 3.75rem
}
  }

@media all and (min-width: 1201px) {

.s-contact-form__bg {
    height: 30rem;
    padding-top: 3.125rem;
    padding-bottom: 3.125rem
}
  }

/* Layout interne - mobile first: column, desktop: row */

.s-contact-form__bg .section-inner {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: flex-start;
  height: 100%;
  gap: 1.875rem;
}

@media all and (min-width: 1025px) {

.s-contact-form__bg .section-inner {
    flex-direction: row
}
  }

/* Colonne gauche: contenu texte */

.s-contact-form__content {
  z-index: 1;
  display: flex;
  flex: 1;
  flex-direction: column;
  gap: 3.125rem;
}

/* Surcharge couleur blanche pour les textes sur fond violet */

.s-contact-form__title,
.s-contact-form__description {
  color: white !important;
}

/* Colonne droite: formulaire - mobile: 100%, desktop: 420px */

.s-contact-form__form-wrapper {
  z-index: 1;
  display: flex;
  flex-direction: column;
  flex-shrink: 0;
  width: 100%;
  max-width: 26.25rem;
  gap: 0.625rem;
}

@media all and (min-width: 1025px) {

.s-contact-form__form-wrapper {
    width: 26.25rem
}
  }

/* Masquer le wrapper contact-section de Drupal */

.s-contact-form__form-wrapper .contact-section-wrapper,
.s-contact-form__form-wrapper .contact-section {
  all: unset;
  display: contents;
}

.s-contact-form__form-wrapper .contact-section__text-content,
.s-contact-form__form-wrapper .contact-section__header,
.s-contact-form__form-wrapper .contact-section__image-wrapper,
.s-contact-form__form-wrapper svg[style*="position: absolute"] {
  display: none !important;
}

.s-contact-form__form-wrapper .contact-section__form-wrapper {
  all: unset;
  display: flex;
  flex-direction: column;
  gap: 0.625rem;
  width: 100%;
}

/* Layout du formulaire Drupal */

.s-contact-form__form-wrapper form {
  display: flex !important;
  flex-direction: column !important;
  gap: 0.625rem !important;
  width: 100% !important;
}

.s-contact-form__form-wrapper .m-form-element {
  margin: 0 !important;
}

.s-contact-form__form-wrapper .form-actions {
  margin: 0 !important;
  padding: 0 !important;
}

/* Image alternative */

.s-contact-form__form-image {
  width: 100%;
  height: auto;
}

/* Responsive - Now handled via mobile-first approach above with @db */
