/* ============================================================
   SMART TECHNOLOGIES — RESPONSIVE CONTACT
   Même système de points de rupture que responsive-index.css :
   1290 · 1200 · 1024 · 900 · 769 · 600 · 485 · 425 · 375 · 320
   À charger APRÈS contact.css
   Cette page n'avait aucune règle responsive existante — tout est neuf.
   ============================================================ */


@media only screen and (max-width: 1290px) {

    /* Réservé — pas d'ajustement nécessaire à ce palier sur cette page */

}


@media only screen and (max-width: 1200px) {

    /********************************* Formulaire & sidebar **********************/

    .contact-grid {
        gap: 30px;
    }

    /********************************* Carte **********************/



    /********************************* FAQ **********************/

    .wrap-faq {
        gap: 30px;
    }

}


@media only screen and (max-width: 1024px) {

    /********************************* Formulaire & sidebar **********************/

    .contact-grid {
        grid-template-columns: 1fr;
    }

    .field-row {
        grid-template-columns: 1fr 1fr;
    }

    /********************************* Carte **********************/

    .map-wrap {
        height: 360px;
    }

    /********************************* FAQ **********************/

    .fq-aside {
        width: 36%;
    }

}


@media only screen and (max-width: 900px) {

    /********************************* Formulaire & sidebar **********************/

    .form-card {
        padding: 32px;
    }

    /********************************* Carte **********************/



    /********************************* FAQ **********************/

    .wrap-faq {
        flex-direction: column;
    }

    .fq-aside {
        width: 100%;
        max-width: 380px;
        margin: 0 auto;
    }

    .faq-list {
        max-width: 100%;
    }

}


@media only screen and (max-width: 769px) {

    /********************************* Formulaire & sidebar **********************/

    .field-row {
        grid-template-columns: 1fr;
        gap: 16px;
    }

    .form-card {
        padding: 26px;
    }

    .info-panel {
        padding: 20px 22px;
    }

    .quick-method {
        padding: 10px 16px;
    }

    .btn-primary {
        padding: 10px;
        font-size: 13px;
    }

    .field input, .field select, .field textarea {
        border-width: 1px;
        font-size: 13px;
        padding: 10px 13px;
    }

    .quick-method .qi {
        width: 40px;
        height: 40px;
    }

    .quick-method strong {
        line-height: 15px;
    }

    /********************************* Carte **********************/

    .map-wrap {
        height: 300px;
    }

    .map-card {
        max-width: 220px;
        padding: 16px 18px;
    }

    /********************************* FAQ **********************/

    .faq-q h4 {
        font-size: 14px;
    }

    .faq-a-inner {
        font-size: 13px;
    }

    .fq-carte-p {
        font-size: 13px;
    }

}


@media only screen and (max-width: 600px) {

    /********************************* Formulaire & sidebar **********************/

    .wrapper-contact {
        padding: 40px 0;
    }

    .form-card {
        padding: 22px;
    }

    .form-card .step-motif {
        display: none;
    }

    .field-consent {
        align-items: flex-start;
    }

    /********************************* Carte **********************/

    .map-wrap {
        height: 260px;
        border-radius: 16px;
    }

    .map-card {
        left: 14px;
        bottom: 14px;
        max-width: calc(100% - 28px);
    }

    /********************************* FAQ **********************/

    .wrapper-fog {
        padding: 40px 0 80px;
    }

    .faq-q {
        padding: 18px 20px;
    }

    .faq-a-inner {
        padding: 0 20px 20px;
    }

}


@media only screen and (max-width: 485px) {

    .container {
        padding: 0 16px !important;
    }

    /********************************* Formulaire & sidebar **********************/

    .field input,
    .field select,
    .field textarea {
        font-size: 12px;
        padding: 11px 14px;
    }

    .quick-method strong {
        font-size: 13.5px;
    }

    .quick-method span {
        font-size: 11px;
    }

    .info-row strong {
        font-size: 13px;
    }

    /********************************* Carte **********************/



    /********************************* FAQ **********************/

    .fq-photo-nom {
        font-size: 16px;
    }

    .fq-contact-v {
        font-size: 12.5px;
    }

    .faq-q h4 {
        font-size: 13.5px;
    }

}


@media only screen and (max-width: 425px) {

    /* Réservé — pas d'ajustement nécessaire à ce palier sur cette page */

}


@media only screen and (max-width: 375px) {

    /********************************* Formulaire & sidebar **********************/

    .form-card {
        padding: 18px;
    }

    .quick-method .qi {
        width: 38px;
        height: 38px;
        font-size: 15px;
    }

    /********************************* Carte **********************/

    .map-wrap {
        height: 220px;
    }

    /********************************* FAQ **********************/

    .fq-bulle {
        width: 42px;
        height: 42px;
        font-size: 15px;
    }

    .faq-q h4 {
        font-size: 13px;
    }

    .faq-plus {
        width: 26px;
        height: 26px;
    }

}


@media only screen and (max-width: 320px) {

    /* Réservé — pas d'ajustement nécessaire à ce palier sur cette page */

}