#launch_offer {
    width: 100%;
    margin-top: 5vh;
}



#launch_offer .section_content{
    width: 100%;
    height: 60em;
    max-height: 80vh;
    background: url("../../../images/web/homepage/final-cta/fond-savane.webp");
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-start;
    gap: 2em;
    position: relative;
    overflow: hidden;
    padding: 1em;
}





#launch_offer .section_content .title_container{
    display: none;
    width: 100%;
    opacity: 0;
    transition: 0.75s opacity ease-in-out;
}
#launch_offer.appear .section_content .title_container{
    opacity: 1;
}


#launch_offer .section_content .title_container svg{
    overflow: visible;
    width: 100%;
    min-width: 50em;
    animation: animeSvgText 10s linear infinite;
}

@keyframes animeSvgText {
    0%{
        transform: translateX(0);
    }
    100%{
        transform: translateX(-100%);
    }
}

#launch_offer .section_content .title_container svg text{
    font-family: "Arial Black", sans-serif !important;
    fill: none;
    stroke: white;
    stroke-width: min(0.5vw, 4em);
    vector-effect: non-scaling-stroke;
}










#launch_offer .section_content .fight_cloud_container{
    width: 100%;
    max-width: 130em;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%) scale(0);
    transition: 0.75s transform ease-in-out;
}


#launch_offer.appear .section_content .fight_cloud_container{
    transform: translate(-50%, -50%) scale(1);
}






#launch_offer .section_content .text_container{
    width: 70%;
    max-width: 30em;
    position: absolute;
    z-index: 2;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -60%);
}

#launch_offer .section_content .text_container .content{
    width: 100%;
    text-align: center;
    font-size: min(3.25em, 7vw);
    color: #575757;
    font-weight: 300;
    text-shadow: 8px 5px 6px #a4a4a4;
    font-family: 'Playpen Sans', serif;
}









#launch_offer .section_content .fight_cloud_container .image_container{
    width: 90%;
    max-width: 40em;
    position: absolute;
    z-index: 1;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -60%);
}

#launch_offer .section_content .fight_cloud_container .image_container img.main{
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    position: relative;
    z-index: 1;
}


#launch_offer .section_content .fight_cloud_container .image_container img.sub{
    width: min(20em, 40vw);
    position: absolute;
    z-index: 0;
    transform: translate(-50%, -50%) scale(0);
    opacity: 1;
}

@keyframes animateCloudTransform {
    0%{
        transform: translate(-50%, -50%) scale(0);
    }
    100%{
        transform: translate(-50%, -50%) scale(1);
    }
}

@keyframes animateCloudOpacity {
    0%{
        opacity: 1;
    }
    50%{
        opacity: 1;
    }
    100%{
        opacity: 0;
    }
}




#launch_offer .section_content .fight_cloud_container .image_container img.sub_1{
    transform-origin: right;
    top: 25%;
    left: 25%;
    animation:
        animateCloudTransform 2.5s ease-in-out infinite,
        animateCloudOpacity 2.5s ease-in-out infinite;
}

#launch_offer .section_content .fight_cloud_container .image_container img.sub_2{
    transform-origin: left;
    top: 20%;
    left: 80%;
    animation:
        animateCloudTransform 3.5s ease-in-out infinite,
        animateCloudOpacity 3.5s ease-in-out infinite;
}

#launch_offer .section_content .fight_cloud_container .image_container img.sub_3{
    transform-origin: right;
    top: 80%;
    left: 20%;
    animation:
        animateCloudTransform 3s ease-in-out infinite,
        animateCloudOpacity 3s ease-in-out infinite;
}

#launch_offer .section_content .fight_cloud_container .image_container img.sub_4{
    transform-origin: left;
    top: 80%;
    left: 80%;
    animation:
        animateCloudTransform 4s ease-in-out infinite,
        animateCloudOpacity 4s ease-in-out infinite;
}

#launch_offer .section_content .fight_cloud_container .image_container img.sub_5{
    transform-origin: right;
    top: 50%;
    left: 10%;
    animation:
        animateCloudTransform 4s ease-in-out infinite,
        animateCloudOpacity 4s ease-in-out infinite;
}

#launch_offer .section_content .fight_cloud_container .image_container img.sub_6{
    transform-origin: left;
    top: 50%;
    left: 90%;
    animation:
        animateCloudTransform 2s ease-in-out infinite,
        animateCloudOpacity 2s ease-in-out infinite;
}









#launch_offer .section_content .fight_cloud_container .fruit_image_container{
    width: 90%;
    max-width: 40em;
    aspect-ratio: 1/1;
    position: absolute;
    z-index: 0;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    /*animation: animateFruitContainer 24s linear infinite;*/
}

@keyframes animateFruitContainer {
    from{
        transform: translate(-50%, -50%) rotate(0deg);
    }
    to{
        transform: translate(-50%, -50%) rotate(360deg);
    }
}


#launch_offer .section_content .fight_cloud_container .fruit_image{
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 100%;
    height: 100%;
}

#launch_offer .section_content .fight_cloud_container .fruit_image.fruit_1{
    transform: translate(-50%, -50%) rotate(0deg);
}

#launch_offer .section_content .fight_cloud_container .fruit_image.fruit_2{
    transform: translate(-50%, -50%) rotate(60deg);
}

#launch_offer .section_content .fight_cloud_container .fruit_image.fruit_3{
    transform: translate(-50%, -50%) rotate(120deg);
}

#launch_offer .section_content .fight_cloud_container .fruit_image.fruit_4{
    transform: translate(-50%, -50%) rotate(180deg);
}

#launch_offer .section_content .fight_cloud_container .fruit_image.fruit_5{
    transform: translate(-50%, -50%) rotate(240deg);
}

#launch_offer .section_content .fight_cloud_container .fruit_image.fruit_6{
    transform: translate(-50%, -50%) rotate(300deg);
}


#launch_offer .section_content .fight_cloud_container .fruit_image_container .fruit{
    width: min(8em, 19vw);
    position: absolute;
    top: 50%;
    left: -50%;
    opacity: 0;
}

@keyframes animateFruit {
    0%{
        top: 50%;
        left: -50%;
        opacity: 0;
    }
    50%{
        top: 50%;
        left: 20%;
        opacity: 1;
    }
    50.5%{
        top: 50%;
        left: 20%;
        opacity: 0;
    }
    100%{
        top: 50%;
        left: -50%;
        opacity: 0;
    }
}



#launch_offer.appear .section_content .fight_cloud_container .fruit_image_container .fruit_image.fruit_1 .fruit{
    animation: animateFruit 5s 0.5s ease-in-out infinite;
}

#launch_offer.appear .section_content .fight_cloud_container .fruit_image_container .fruit_image.fruit_2 .fruit{
    animation: animateFruit 5s 1s ease-in-out infinite;
}

#launch_offer.appear .section_content .fight_cloud_container .fruit_image_container .fruit_image.fruit_3 .fruit{
    transform: scaleY(-1);
    width: min(6em, 15vw);
    animation: animateFruit 5s 0.75s ease-in-out infinite reverse;
}

#launch_offer.appear .section_content .fight_cloud_container .fruit_image_container .fruit_image.fruit_4 .fruit{
    transform: scaleY(-1) scaleX(-1);
    animation: animateFruit 5s 2.5s ease-in-out infinite;
}

#launch_offer.appear .section_content .fight_cloud_container .fruit_image_container .fruit_image.fruit_5 .fruit{
    transform: scaleY(-1);
    animation: animateFruit 5s 2s ease-in-out infinite;
}

#launch_offer.appear .section_content .fight_cloud_container .fruit_image_container .fruit_image.fruit_6 .fruit{
    transform: scaleX(-1);
    animation: animateFruit 5s 1.75s ease-in-out infinite reverse;
}











#launch_offer .section_content .cta{
    width: max-content;
    margin: auto auto 3vh;
    box-shadow: 0px 4px 5px #00000059;
    font-size: min(1.1em, 4vw);
    position: relative;
    z-index: 3;
}