/***********************************
**********     Footer     **********
***********************************/

#footer.footer-indus {
    padding: 3rem 0;

    .container-black {
        background-color: var(--color-default);
        border-radius: .75rem;
        padding: 3.75rem;
    }

    a {
        color: inherit;
    }

    .footer-indus-top .list {
        max-width: 100%;
        display: flex;
        flex-direction: row;
        flex-wrap: nowrap;
        align-items: flex-end;
        gap: 4rem;
    }

    .footer-indus-top {
        padding-bottom: 3rem;
        margin-bottom: 3rem;
        border-bottom: 1px solid var(--color-background);
    }


    .top .col {
        flex-basis: calc(33% - 2rem);
    }

    .col-1 .logo-wrapper {
        max-width: 100%;
        margin-bottom: 5.2rem;
    }

    .col-1 .logo-wrapper .logo {
        margin: auto;
        max-height: 10rem;
        height: 10rem;
    }

    .col .title {
        margin-bottom: 1.5rem;
        font-size: 1.5rem;
    }

    .col .title-section-3 {
        text-align: left;
    }

    .address-wrapper,
    .phone-wrapper {
        display: flex;
        column-gap: 1rem;
        margin-top: 2.25rem;
    }

    .address-wrapper address {
        margin-top: 0;
    }

    .address-wrapper svg,
    .phone-wrapper svg {
        height: 1.725rem;
        fill: var(--color-primary);
    }

    .phone-wrapper .phone {
        font-size: 1.25rem;
        font-weight: 400;
        font-family: var(--font-general);
    }

    .btn-wrapper .btn-primary {
        background-color: var(--color-primary);
        color: var(--color-default);
        margin-top: .75rem;
    }

    .btn-wrapper .btn-primary:not(:active):hover {
        background-color: var(--color-background) !important;
        color: var(--color-default) !important;
    }

    .menu-wrapper li:not(:first-child) {
        margin-top: 1.95rem;
    }

    .bottom * {
        color: var(--color-default);
        fill: var(--color-default);
    }
}

.mode-uppercase #footer.footer-indus .menu-wrapper a {
    font-size: 1.5625rem;
    font-family: var(--font-general);
}

/***********************************
*********    Newsletter    *********
***********************************/

#newsletter-footer {
    .txt.editor {
        display: flex;
        column-gap: 1rem;
        row-gap: 1rem;
        align-items: center;
        justify-content: space-between;
    }

    iframe {
        position: relative;
        z-index: 2;
    }

    .txt.editor::before {
        z-index: 1;
        position: absolute;
        content: "";
        width: 200%;
        height: 100%;
        top: 0;
        left: 40%;
        background-color: #fff;
        /* Maquette 2026 : bord gauche en demi-cercle parfait (rayon = moitié de la hauteur) */
        border-radius: 999px 0 0 999px;
    }
}
/***********************************
*****    Footer — maquette 2026    *****
***********************************/
/* Valeurs relevées sur la maquette XD (écran 1920px) :
   bloc noir 1782px (marges 68px), rayon 20px, marges intérieures 64 / 66 / 54px ;
   illustrations réparties sur toute la largeur, 80px au-dessus du filet, contenu 65px dessous ;
   colonnes : logo centré sur 662px | "Nous trouver" à 764px | menu à 1211px (du bord intérieur). */

/* Typographies (toutes tailles d'écran) */
#footer.footer-indus .col-1 .title {
    font-family: var(--font-general), arial, sans-serif;
    font-size: 1.5625rem;      /* Mulish Bold 25/45, -1px */
    font-weight: 700;
    letter-spacing: -.04em;
    line-height: 1.8;
    margin: 0 0 .75rem;
    text-align: center;
    text-transform: uppercase;
}

#footer.footer-indus .col-2 .title {
    font-family: var(--font-title), 'mattone', sans-serif;
    font-size: 1.5rem;         /* Mattone Bold 24/34 */
    font-weight: 700;
    letter-spacing: 0;
    line-height: 1.417;
    margin: 0 0 1rem;
    text-transform: uppercase;
}

#footer.footer-indus .address-wrapper,
#footer.footer-indus .phone-wrapper {
    align-items: flex-start;
    column-gap: .9375rem;      /* texte à 15px de l'icône */
    margin: 0 0 2.75rem;       /* 44px entre les blocs */
}

#footer.footer-indus .address-wrapper svg,
#footer.footer-indus .phone-wrapper svg {
    flex: 0 0 1.5rem;
    height: 1.9375rem;         /* pictos 24×31, 3px sous le haut du texte */
    margin-top: .1875rem;
    width: 1.5rem;
}

#footer.footer-indus .address-wrapper address,
#footer.footer-indus .phone-wrapper .phone {
    font-family: var(--font-general), arial, sans-serif;
    font-size: 1.125rem;       /* Mulish 18/22, -0.36px */
    font-style: normal;
    font-weight: 400;
    letter-spacing: -.02em;
    line-height: 1.222;
    margin: 0;
}

#footer.footer-indus .phone-wrapper {
    margin-bottom: 1.1875rem;  /* 31px entre le texte et le bouton */
}

#footer.footer-indus .btn-wrapper .btn-primary {
    align-items: center;
    border-radius: 1.1875rem;
    display: inline-flex;
    font-size: 1.1875rem;      /* Mulish Black 19px, -0.38px */
    height: 2.375rem;          /* 214×38 */
    letter-spacing: -.02em;
    line-height: .895;
    margin: 0;
    padding: 0 1.1875rem;
    text-transform: uppercase;
}

#footer.footer-indus .menu-wrapper a,
.mode-uppercase #footer.footer-indus .menu-wrapper a {
    font-family: var(--font-general), arial, sans-serif;
    font-size: 1.5625rem;      /* Mulish Bold 25/45, -1px */
    font-weight: 700;
    letter-spacing: -.04em;
    line-height: 1.8;
    text-transform: uppercase;
}

#footer.footer-indus .menu-wrapper li:not(:first-child) {
    margin-top: .75rem;        /* 57px d'une ligne à l'autre */
}

/* Réseaux sociaux : pictos 36px */
#footer.footer-indus .social-networks {
    flex-wrap: wrap;
    gap: .75rem clamp(1rem, 2.08vw, 2.5rem);
    justify-content: center;
}

#footer.footer-indus .social-networks .link {
    align-items: center;
    display: flex;
    height: 2.25rem;
    justify-content: center;
    width: auto;
}

#footer.footer-indus .social-networks svg {
    fill: #fff;
    height: 2.25rem;
    width: 2.25rem;
}

/* Mentions : Mulish 16/24, -0.32px, majuscules */
#footer.footer-indus .bottom,
#footer.footer-indus .bottom .link,
#footer.footer-indus .bottom a {
    font-size: 1rem;
    letter-spacing: -.02em;
    line-height: 1.5;
    text-transform: uppercase;
}

@media only screen and (min-width: 1200px) {
    #footer.footer-indus {
        padding: .25rem 0 .5rem;
    }

    #footer.footer-indus .container-large {
        padding-left: 3.5417vw;    /* 68px sur 1920 */
        padding-right: 3.5417vw;
    }

    #footer.footer-indus .container-black {
        border-radius: 1.25rem;
        padding: 4rem 4.125rem 2.625rem;
    }

    #footer.footer-indus .footer-indus-top {
        margin-bottom: 4rem;       /* 65px sous le filet */
        padding-bottom: 5rem;      /* 80px sous les illustrations */
    }

    #footer.footer-indus .footer-indus-top .list {
        gap: 1rem;
        justify-content: space-between;
    }

    #footer.footer-indus .top {
        align-items: start;
        column-gap: 6.18%;
        display: grid;
        grid-template-columns: 40.12% 20.91% 1fr;
    }

    #footer.footer-indus .top .col {
        flex-basis: auto;
        min-width: 0;
    }

    #footer.footer-indus .top .col-2 {
        padding-top: .375rem;
    }

    #footer.footer-indus .top .col-3 {
        padding-top: 1.0625rem;
    }

    #footer.footer-indus .top .col-3 .col {
        margin: 0;
        padding: 0;
    }

    #footer.footer-indus .col-1 .logo-wrapper {
        margin-bottom: 4.6875rem;  /* 75px jusqu'à "Suivez-nous" */
    }

    #footer.footer-indus .col-1 .logo-wrapper .logo {
        display: block;
        height: 10.3125rem;        /* 396×165 */
        max-height: none;
    }

    /* Logos partenaires : 36px sous le bloc noir, mentions juste dessous */
    #footer.footer-indus .footer-custom-block .module {
        padding-bottom: .25rem;
        padding-top: 2.25rem;
    }

    #footer.footer-indus .bottom {
        margin-top: 0;
    }
}

/***********************************
*****    Footer — mobile / tablette    *****
***********************************/
/* Le thème masquait sous 1024px la colonne "Nous trouver" (adresses, téléphone, bouton) et le menu :
   on les réaffiche, centrés, sous le logo et les réseaux */
@media only screen and (max-width: 1024px) {
    #footer.footer-indus .top .col-2 {
        display: block;
        margin-top: 2.5rem;
        text-align: center;
        width: 100%;
    }

    #footer.footer-indus .top .col-3 .col-2 {
        margin-top: 2rem;
    }

    #footer.footer-indus .col-2 .title {
        text-align: center;
    }

    #footer.footer-indus .address-wrapper,
    #footer.footer-indus .phone-wrapper {
        justify-content: center;
        margin-bottom: 1.5rem;
        text-align: left;
    }

    #footer.footer-indus .col-2 .btn-wrapper {
        justify-content: center;
    }

    #footer.footer-indus .menu-wrapper ul {
        padding: 0;
    }

    #footer.footer-indus .menu-wrapper a,
    .mode-uppercase #footer.footer-indus .menu-wrapper a {
        font-size: 1.125rem;
        line-height: 1.6;
    }

    #footer.footer-indus .menu-wrapper li:not(:first-child) {
        margin-top: .25rem;
    }
}

/* Liens du bas (Mentions légales, CGV, Plan du site…) : espacés, ils se collaient en passant à la ligne */
#footer #menu-menu-mentions {
    column-gap: 1.25rem;
    justify-content: center;
    row-gap: .375rem;
}

/* Illustrations des monuments en haut du bloc noir : sur une seule ligne sans retour, elles s'écrasaient
   jusqu'à disparaître sur mobile ; on les répartit sur plusieurs lignes, à hauteur fixe */
@media only screen and (max-width: 1024px) {
    #footer.footer-indus .footer-indus-top .list {
        align-items: flex-end;
        flex-wrap: wrap;
        gap: .875rem 1.125rem;
        justify-content: center;
        padding: 0;
    }

    #footer.footer-indus .footer-indus-top .list .item {
        flex: 0 0 auto;
    }

    #footer.footer-indus .footer-indus-top .list .icon svg {
        height: 2.25rem;
        max-width: 5.5rem;
        width: auto;
    }
}

/* Fine ligne claire entre la newsletter et le pied de page : les deux blocs se touchent à une position
   décimale et le fond de la page apparaissait entre eux ; le pied de page remonte d'un pixel */
#footer.footer-indus {
    margin-top: -1px;
    position: relative;
}