/* ==========================================================================
   Footer — conteneur général
   ========================================================================== */
.site_footer {
    display: flex;
    width: 100%;
    flex-direction: column;
    align-items: center;
}

.site_footer_main {
    display: flex;
    width: 100%;
    justify-content: center;
    background: #DEE7F1;
    padding: 67px 0px;
}

.site_footer_main_sized {
    display: flex;
    width: calc(100% - 20px);
    max-width: 1560px;
}

/* ==========================================================================
   Colonnes gauche / droite
   ========================================================================== */
.site_footer_left,
.site_footer_right {
    display: flex;
    width: 300px;
    flex-direction: column;
}

.site_footer_left {
    align-items: flex-start;
}

.site_footer_right {
    align-items: flex-end;
}



.site_footer_left > div {
    text-align: left;
    font: normal normal normal 18px/24px OS_Regular;
    letter-spacing: 0px;
    color: #100D08;
    margin-top: 10px;
}

.site_footer_left img,
.site_footer_right img{
    display: block;
    max-width: 100%;
}

/* ==========================================================================
   Menu central
   ========================================================================== */
.site_footer_center_menu {
    display: flex;
    width: calc(100% - 600px);
    flex-wrap: wrap;
    padding: 0px 40px;
    box-sizing: border-box;
    justify-content: center;
}

.site_footer_center_menu_bloc {
    display: flex;
    width: 30%;
    flex-direction: column;
}

.site_footer_center_menu_bloc_title {
    display: flex;
    width: 100%;
    box-sizing: border-box;
    text-align: left;
    font: normal normal normal 20px/24px OS_Bold;
    letter-spacing: 0px;
    color: #100D08;
}

.site_footer_center_menu_bloc_list {
    display: flex;
    width: 100%;
    flex-direction: column;
    margin-top: 20px;
}

.site_footer_center_menu_bloc_list a {
    text-align: left;
    font: normal normal normal 18px/24px OS_Regular;
    letter-spacing: 0px;
    color: #100D08;
    text-decoration: none;
    padding: 6px 0px;
}

.site_footer_center_menu_bloc_title_line {
    background: #1D82C8;
    height: 4px;
    width: 70%;
    margin-top: 14px;
}

/* ==========================================================================
   Bas de footer (réseaux sociaux, back to top)
   ========================================================================== */
.site_footer_extra {
    display: flex;
    width: 100%;
    justify-content: center;
}

.site_footer_extra_sized {
    display: flex;
    width: calc(100% - 20px);
    max-width: 1540px;
    justify-content: space-between;
    align-items: center;
    padding: 10px;
}

.site_footer_extra_left {
    display: flex;
    align-items: center;
    gap: 15px;
}

.site_footer_extra_left_rs {
    display: flex;
    gap: 10px;
}

.site_footer_extra_left_rs_i img {
    height: 26px;
}

.footer_back_to_top {
    cursor: pointer;
}

.footer_back_to_top img {
    height: 28px;
}

/* ==========================================================================
   Responsive — Tablette (≤ 1024px)
   Colonnes gauche/droite réduites, le menu central regagne l'espace libéré.
   ========================================================================== */
@media (max-width: 1024px) {
    .site_footer_left,
    .site_footer_right {
        width: 220px;
    }

    .site_footer_center_menu {
        width: calc(100% - 440px);
        padding: 0px 20px;
    }

    .site_footer_center_menu_bloc {
        width: 45%;
    }
}

/* ==========================================================================
   Responsive — Mobile large (≤ 768px)
   Les 3 colonnes passent en pile verticale, centrées.
   ========================================================================== */
@media (max-width: 768px) {
    .site_footer_main {
        padding: 45px 0px;
    }

    .site_footer_main_sized {
        flex-direction: column;
        align-items: center;
        gap: 35px;
    }

    .site_footer_left,
    .site_footer_right,
    .site_footer_center_menu {
        width: 100%;
    }

    .site_footer_left {
        align-items: center;
        text-align: center;
    }

    .site_footer_right {
        align-items: center;
    }

    .site_footer_center_menu {
        padding: 0px;
    }

    .site_footer_center_menu_bloc {
        width: 45%;
        align-items: flex-start;
    }

    .site_footer_extra_sized {
        flex-direction: column;
        gap: 15px;
        padding: 15px 10px;
    }
}

/* ==========================================================================
   Responsive — Mobile petit (≤ 480px)
   Une seule colonne de menu par ligne (2 colonnes de texte deviennent trop
   étroites en dessous de ~480px pour rester lisibles).
   ========================================================================== */
@media (max-width: 480px) {
    .site_footer_main {
        padding: 35px 0px;
    }

    .site_footer_center_menu_bloc {
        width: 100%;
        align-items: center;
        text-align: center;
    }

    .site_footer_center_menu_bloc_title {
        justify-content: center;
        text-align: center;
        margin-top: 30px;
    }

    .site_footer_center_menu_bloc_list a {
        text-align: center;
    }

    .site_footer_center_menu_bloc_title_line {
        margin-left: auto;
        margin-right: auto;
    }

    .site_footer_left > div {
        font: normal normal normal 18px/24px OS_Regular;
        text-align: justify;
    }

    .site_footer_center_menu_bloc_list a {
        font: normal normal normal 18px/24px OS_Regular;
    }
}