/**
 * Bloc Formulaire Contact - Styles
 */

/* =============================================
   SECTION
   ============================================= */

.blocFormulaire {
    padding: 60px 0;
    width: 100%;
}

/* =============================================
   TITRE DE SECTION (au-dessus des cartes)
   ============================================= */

.blocFormulaire__section-title {
    font-family: 'Montserrat', sans-serif;
    font-size: 30px;
    font-weight: 700;
    line-height: normal;
    text-align: center;
    margin-bottom: 40px;
}

.blocFormulaire--light .blocFormulaire__section-title {
    color: #202e3b;
}

.blocFormulaire--dark .blocFormulaire__section-title {
    color: #f8f5e2;
}

/* =============================================
   GRILLE DES CARTES
   ============================================= */

.blocFormulaire__cards {
    --card-gap: 40px;
}

/* =============================================
   CARTE (commune aux deux colonnes)
   ============================================= */

.blocFormulaire__card {
    background: #ffffff;
    padding: 40px;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 12px;
}

/* =============================================
   ICÔNE EN HAUT DE CARTE
   ============================================= */

.blocFormulaire__card-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    padding-bottom: 10px;
}

.blocFormulaire__card-icon img,
.blocFormulaire__card-icon svg {
    display: block;
    width: auto;
    height: 28px;
}

/* =============================================
   TITRE DE CARTE (span.h4)
   ============================================= */

.blocFormulaire__card-title {
    text-align: center;
    color: #202e3b;
    width: 100%;
}

/* =============================================
   CARTE CONSEILLER — tout centré
   ============================================= */

.blocFormulaire__card--conseiller .blocFormulaire__card-txt {
    font-size: 14px;
    line-height: 1.6;
    text-align: center;
    color: #202e3b;
    width: 100%;
}

.blocFormulaire__card--conseiller .blocFormulaire__card-txt > *:first-child { margin-top: 0; }
.blocFormulaire__card--conseiller .blocFormulaire__card-txt > *:last-child  { margin-bottom: 0; }

/* =============================================
   CARTE FORMULAIRE
   ============================================= */

.blocFormulaire__card--form {
    align-items: center;
}

.blocFormulaire__gf-wrapper {
    width: 100%;
}



/* Bouton submit stylisé comme .btn.btn-primary.orange.fill */
.blocFormulaire .blocFormulaire__gf-wrapper .gform_footer .gform_button,
.blocFormulaire .blocFormulaire__gf-wrapper .gform_page_footer .gform_button,
.blocFormulaire .blocFormulaire__gf-wrapper .gform_footer button[type="submit"],
.blocFormulaire .blocFormulaire__gf-wrapper .gform_footer input[type="submit"] {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 15px !important;
    min-height: 50px !important;
    padding: 5px 25px !important;
    border-radius: 25px !important;
    background-color: #F05534 !important;
    color: #F8F5E2 !important;
    font-family: 'Montserrat', sans-serif !important;
    font-weight: 600 !important;
    font-size: 16px !important;
    line-height: normal !important;
    border: none !important;
    box-shadow: none !important;
    cursor: pointer !important;
    text-transform: none !important;
    letter-spacing: 0 !important;
    width: auto !important;
    transition: background-color 0.4s cubic-bezier(0.4, 0, 0.2, 1),
                gap 0.4s cubic-bezier(0.4, 0, 0.2, 1);
}

.blocFormulaire__gf-wrapper .gform-footer {
    justify-content: flex-end;
}

.blocFormulaire .blocFormulaire__gf-wrapper .gform_footer .gform_button:hover,
.blocFormulaire .blocFormulaire__gf-wrapper .gform_footer .gform_button:focus-visible,
.blocFormulaire .blocFormulaire__gf-wrapper .gform_footer button[type="submit"]:hover,
.blocFormulaire .blocFormulaire__gf-wrapper .gform_footer input[type="submit"]:hover {
    background-color: #F64B26 !important;
    color: #F8F5E2 !important;
    opacity: 1 !important;
    transform: none !important;
    gap: 23px !important;
}

/* Champs en grille 2 colonnes sur desktop (Prénom / Nom, Tel / Email) */
.blocFormulaire__gf-wrapper .gform_fields {
    display: grid;
    grid-template-columns: 1fr 1fr;
    column-gap: 15px;
    grid-row-gap: 0!important;
}

/* Les champs qui occupent toute la largeur (message, fichier, consent, submit) */
.blocFormulaire__gf-wrapper .gfield--width-full,
.blocFormulaire__gf-wrapper .gfield_html,
.blocFormulaire__gf-wrapper .gfield--type-consent,
.blocFormulaire__gf-wrapper .gfield--type-fileupload,
.blocFormulaire__gf-wrapper .gfield--type-textarea,
.blocFormulaire__gf-wrapper .gform_footer {
    grid-column: 1 / -1;
}

/* =============================================
   GAP ENTRE LES DEUX CARTES
   (Bootstrap g-0 = pas de gutter natif,
    on ajoute un gap via padding)
   ============================================= */

@media (min-width: 992px) {
    .blocFormulaire__cards .col-lg-6:first-child .blocFormulaire__card {
        margin-right: calc(var(--card-gap) / 2);
    }
    .blocFormulaire__cards .col-lg-6:last-child .blocFormulaire__card,
    .blocFormulaire__cards .col-lg-6:only-child .blocFormulaire__card {
        margin-left: calc(var(--card-gap) / 2);
    }
}

/* =============================================
   FLOATING LABEL — GRAVITY FORMS
   ============================================= */

.blocFormulaire .gfield {
    position: relative;
    padding-top: 16px;
    margin-bottom: 10px;
}

.blocFormulaire .gfield--floating-label .gfield_label {
    position: absolute;
    top: 30px;
    left: 0;
    font-size: 14px;
    font-weight: 400;
    text-transform: none;
    letter-spacing: 0;
    color: rgba(29, 29, 27, 1);
    pointer-events: none;
    transition: top 0.2s ease, font-size 0.2s ease, color 0.2s ease;
    z-index: 1;
    line-height: 1.4;
    margin-bottom: 0;
}

.blocFormulaire .gfield--floating-label.gf-label-up .gfield_label,
.blocFormulaire .gfield--floating-label:focus-within .gfield_label {
    top: 0;
    font-size: 10px;
    letter-spacing: 0.5px;
    color: #334258;
}

.blocFormulaire .gfield--floating-label input::placeholder {
    color: transparent;
}

.blocFormulaire .gfield--floating-label .gfield_label .gfield_required {
    display: none;
}

/* =============================================
   RESPONSIVE
   ============================================= */

@media (max-width: 991px) {
    .blocFormulaire {
        padding: 50px 0;
    }

    .blocFormulaire__section-title {
        font-size: 22px;
        margin-bottom: 25px;
    }

    .blocFormulaire__cards .col-lg-6:first-child .blocFormulaire__card {
        margin-right: 0;
        margin-bottom: 20px;
    }

    .blocFormulaire__cards .col-lg-6:last-child .blocFormulaire__card,
    .blocFormulaire__cards .col-lg-6:only-child .blocFormulaire__card {
        margin-left: 0;
    }

    .blocFormulaire__gf-wrapper .gform_fields {
        grid-template-columns: 1fr;
    }

    .blocFormulaire__gf-wrapper .gfield--width-full,
    .blocFormulaire__gf-wrapper .gform_footer {
        grid-column: 1;
    }
}

