#homepage .container {
    display: flex;
    flex-wrap: wrap;
    background-color: var(--white);
    position: relative;
}

#homepage .container .image {
    flex: 0 0 60%;
    height: 100%;
    overflow: hidden;
}

#homepage .image .border_image {
    height: 100vh;
    max-height: clamp(0px, 60vh, 800px);
    display: flex;
    justify-content: center;
    align-items: center;
    position: relative;
}

#homepage .image img {
    position: absolute;
    width: 100%;
    min-height: 100%;
    object-fit: cover;
    display: block;
    opacity: 0;
    animation: fade 12s infinite; /* 3 images × 3s chacune = 9s */
}

/* Keyframes crossfade parfait */
@keyframes fade {
    0%   { opacity: 0; }
    8%  { opacity: 1; }   /* fade in */
    32%  { opacity: 1; }   /* visible */
    40%  { opacity: 0; }   /* fade out */
    100% { opacity: 0; }   /* reste caché */
}


#homepage .border_image img:nth-child(1) { animation-delay: 0s; }
#homepage .border_image img:nth-child(2) { animation-delay: 4s; }
#homepage .border_image img:nth-child(3) { animation-delay: 8s; }



#homepage .container .text {
    flex: 0 0 40%;
    display: flex;
}

@media screen and (max-width: 767px) {
    #homepage .container .image,
    #homepage .container .text {
        position: relative;
        flex: 0 0 100%;
    }
}

#homepage .container .content {
    background-color: var(--white);
    flex: 1;
    max-height: 90%;
    padding: 15px;
    justify-content: center;
    word-break: break-word;
    display: flex;
    justify-content: center;
    flex-direction: column;
}

#homepage .text .title h2 {
    text-transform: uppercase;
    font-size: var(--hp-ffs-18);
    margin-block: 5%;
    line-height: 1;
}

#homepage .text .desc {
    text-transform: uppercase;
    font-size: var(--hp-ffs-14);
    font-weight: 600;
}

#homepage .text .book {
    height: 40%;
}
#homepage .text .book a {
    font-size: var(--fs-16);
    background-color: var(--beige-low-dark);
    opacity: .8;
}