.section-retrofit {
        margin-top: 95px;
        position: relative;
        height: 180vh;
        @media screen and (max-width: 1000px) {
            height: auto;
         } 

        img {
            position: sticky;
            top: 0;
            width: 100%;
            height: 111vh;
            object-fit: cover;
            @media screen and (max-width: 1000px) {
                position: static;
                width: 100%;
                height: auto;
             } 
        }

        .section-retrofit-panel  {
            @media screen and (max-width: 1000px) {
                width: 100%;
                background-color: var(--bleu);
             } 
            .container {
                .contenu {
                    width: 554.291px;
                    border-radius: 8px;
                    background-color: var(--bleu);
                    color: white;
                    padding: 70px 48px 105px 39px;
                    position: relative;
                    top: -175px;
                    @media screen and (max-width: 1000px) {
                        position: static;
                        border-radius: 0;
                        margin-top: -5px;
                        width: 100%;
                        padding: 70px 0 105px 0;
                     } 


                    .surtitre {
                        color: white;
                    }

                    hr {
                        width: 100%;
                        border: 1px solid white;
                        margin-bottom: 8px;
                    }

                    h2 {
                        margin: 28px 0 100px 0;
                        @media screen and (max-width: 600px) {
                            margin-bottom: 50px;
                         }
                    }

                    a {
                        background: #fff;
                        background-color: #fff;
                        background-image: linear-gradient(#fff, #fff);
                        border-radius: 4px;
                        color-scheme: only light;
                        forced-color-adjust: none;
                        -webkit-print-color-adjust: exact;
                        print-color-adjust: exact;
                        @media screen and (max-width: 600px) {
                            width: 100%;
                        }

                        &::before {
                            content: "";
                            position: absolute;
                            inset: 0;
                            z-index: 0;
                            background: #fff;
                            background-color: #fff;
                            background-image: linear-gradient(#fff, #fff);
                            border-radius: 4px;
                            pointer-events: none;
                            forced-color-adjust: none;
                        }

                        svg {
                            position: relative;
                            z-index: 1;

                            path {
                                fill: var(--bleu) !important;
                                stroke: var(--bleu) !important;
                            }
                        }

                        .bouton-retrofit-white-bg {
                            position: absolute;
                            inset: 0;
                            z-index: 0;
                            display: block;
                            width: 100%;
                            height: 100%;
                            pointer-events: none;
                            forced-color-adjust: none;
                            color-scheme: only light;

                            rect {
                                fill: #ffffff !important;
                                stroke: #ffffff !important;
                            }
                        }

                        p {
                            color: var(--bleu) !important;
                            -webkit-text-fill-color: var(--bleu) !important;
                            position: relative;
                            z-index: 1;
                        }
                    }
                }
            }
        }
    }

@media screen and (max-width: 1024px) {
    .section-retrofit {
        width: 100vw;
        max-width: 100vw;
        margin-left: calc(50% - 50vw);
        margin-right: calc(50% - 50vw);
        overflow: hidden;
        background: var(--bleu) !important;
        background-color: var(--bleu) !important;
        color-scheme: only light;
    }

    .section-retrofit .section-retrofit-panel {
        width: 100vw;
        max-width: 100vw;
        margin-left: 0;
        margin-right: 0;
        overflow: hidden;
        background: var(--bleu) !important;
        background-color: var(--bleu) !important;
        color-scheme: only light;
    }

    .section-retrofit .section-retrofit-panel .container {
        width: 100%;
        max-width: 100%;
        margin: 0;
        padding: 0 5%;
        box-sizing: border-box;
    }

    .section-retrofit .section-retrofit-panel .container .contenu {
        width: 100%;
        max-width: 100%;
        box-sizing: border-box;
        overflow: hidden;
    }

    .section-retrofit .section-retrofit-panel .container .contenu a.bouton,
    .section-retrofit .section-retrofit-panel .container .contenu a.bouton-retrofit-mobile-fix {
        width: 100%;
        max-width: 100%;
        margin-top: 28px;
        background: #ffffff !important;
        background-color: #ffffff !important;
        background-image: linear-gradient(#ffffff, #ffffff) !important;
        box-shadow: none !important;
        border-radius: 4px;
        overflow: hidden;
        isolation: isolate;
        color-scheme: only light;
        forced-color-adjust: none;
        -webkit-print-color-adjust: exact;
        print-color-adjust: exact;
    }

    .section-retrofit .section-retrofit-panel .container .contenu a.bouton::before,
    .section-retrofit .section-retrofit-panel .container .contenu a.bouton-retrofit-mobile-fix::before {
        display: block !important;
        content: "" !important;
        position: absolute;
        inset: 0;
        z-index: -1;
        background: #ffffff !important;
        background-color: #ffffff !important;
        background-image: linear-gradient(#ffffff, #ffffff) !important;
        border-radius: 4px;
        pointer-events: none;
        forced-color-adjust: none;
    }

    .section-retrofit .section-retrofit-panel .container .contenu a.bouton::after,
    .section-retrofit .section-retrofit-panel .container .contenu a.bouton-retrofit-mobile-fix::after {
        display: none !important;
        content: none !important;
    }

    .section-retrofit .section-retrofit-panel .container .contenu a.bouton p,
    .section-retrofit .section-retrofit-panel .container .contenu a.bouton-retrofit-mobile-fix p {
        color: var(--bleu) !important;
        -webkit-text-fill-color: var(--bleu) !important;
    }

    .section-retrofit .section-retrofit-panel .container .contenu a.bouton svg path,
    .section-retrofit .section-retrofit-panel .container .contenu a.bouton-retrofit-mobile-fix svg path {
        fill: var(--bleu) !important;
        stroke: var(--bleu) !important;
    }

    .section-retrofit .section-retrofit-panel .container .contenu a.bouton-retrofit-mobile-fix .bouton-retrofit-white-bg,
    .section-retrofit .section-retrofit-panel .container .contenu a.bouton-retrofit-mobile-fix .bouton-retrofit-white-bg rect {
        fill: #ffffff !important;
        stroke: #ffffff !important;
        background: #ffffff !important;
        background-color: #ffffff !important;
        forced-color-adjust: none !important;
    }
}