/* ===================================
COLONNE GAUCHE
=================================== */

.bouee-slide{
    display:none;
}

.bouee-slide.active{
    display:block;
}



.lightbox.active{
    display:flex;
}

.bouee-left{
    width:100%;
    display:flex;
    flex-direction:column;
    gap:25px;
}

/* ===================================
GALERIE
=================================== */

.bouee-gallery{
    background:#fff;
    border-radius:20px;
    overflow:hidden;
    box-shadow:0 4px 15px rgba(0,0,0,.08);
}

.bouee-slider{
    position:relative;
}

.bouee-slides{
    position:relative;
}

.bouee-slide{
    display:none;
    width:100%;
    height:auto;
    object-fit:cover;
}

.bouee-slide.active{
    display:block;
}

/* ===================================
FLECHES
=================================== */

.bouee-arrow{
    position:absolute;
    top:50%;
    transform:translateY(-50%);
    width:52px;
    height:52px;
    border:none;
    border-radius:50%;
    background:#0b2f72;
    color:#fff;
    cursor:pointer;
    font-size:22px;
    z-index:20;
    transition:.2s;
}

.bouee-arrow:hover{
    transform:translateY(-50%) scale(1.08);
}

.bouee-prev{
    left:15px;
}

.bouee-next{
    right:15px;
}

/* ===================================
MINIATURES
=================================== */

.bouee-thumbs{
    display:flex;
    gap:12px;
    padding:15px;
    overflow-x:auto;
}

.bouee-thumb{
    width:120px;
    height:80px;
    object-fit:cover;
    border-radius:12px;
    cursor:pointer;
    border:3px solid transparent;
    transition:.2s;
    flex-shrink:0;
}

.bouee-thumb:hover{
    transform:scale(1.03);
}

.bouee-thumb.active{
    border-color:#f5c400;
}

/* ===================================
DOTS
=================================== */

.bouee-dots{
    display:flex;
    justify-content:center;
    gap:8px;
    padding:0 0 20px;
}

.bouee-dot{
    width:10px;
    height:10px;
    border-radius:50%;
    background:#d7dce5;
}

.bouee-dot.active{
    background:#0b2f72;
}

/* ===================================
INFORMATIONS IMPORTANTES
=================================== */

.bouee-important{
    background:#fff;
    border-radius:20px;
    padding:30px;
    box-shadow:0 4px 15px rgba(0,0,0,.08);
}

.bouee-important h3{
    margin:0 0 25px;
    color:#0b2f72;
    font-size:24px;
    font-weight:700;
}

.bouee-important ul{
    list-style:none;
    margin:0;
    padding:0;
}

.bouee-important li{
    position:relative;
    padding-left:30px;
    margin-bottom:14px;
    color:#17345c;
    line-height:1.5;
}

.bouee-important li:before{
    content:"✓";
    position:absolute;
    left:0;
    top:0;
    color:#0b2f72;
    font-weight:bold;
}

/* ===================================
BLOC JAUNE
=================================== */

.bouee-group-box{
    margin-top:25px;
    background:#fff4c8;
    border-radius:16px;
    padding:20px;
}

.bouee-group-box strong{
    display:block;
    margin-bottom:8px;
    color:#0b2f72;
    font-size:18px;
}

.bouee-group-box p{
    margin:0;
    color:#17345c;
    line-height:1.5;
}

/* ===================================
TABLETTE
=================================== */

@media(max-width:1024px){

    .bouee-important{
        padding:25px;
    }

    .bouee-thumb{
        width:100px;
        height:70px;
    }

}

/* ===================================
MOBILE
=================================== */

@media(max-width:768px){

    .bouee-arrow{
        width:42px;
        height:42px;
        font-size:18px;
    }

    .bouee-thumb{
        width:85px;
        height:60px;
    }

    .bouee-important{
        padding:20px;
    }

    .bouee-important h3{
        font-size:20px;
    }

}

/* ===================================
PETIT MOBILE
=================================== */

@media(max-width:480px){

    .bouee-thumb{
        width:70px;
        height:50px;
    }

    .bouee-important{
        padding:16px;
    }

    .bouee-important li{
        font-size:14px;
    }

}


/* ==========================
COLONNE MILIEU
========================== */

.bouee-middle{
    display:flex;
    flex-direction:column;
    gap:25px;
}

.bouee-title{
    margin:0;
    font-size:52px;
    font-weight:900;
    text-transform:uppercase;
    color:#07286c;
    line-height:1;
}

.bouee-description{
    margin:0;
    font-size:18px;
    line-height:1.8;
    color:#20345f;
}

.bouee-features{
    display:flex;
    flex-direction:column;
    gap:22px;
}

.bouee-feature{
    display:flex;
    align-items:flex-start;
    gap:16px;
}

.bouee-icon{
    width:60px;
    height:60px;
    min-width:60px;
    border-radius:50%;
    background:#07286c;
    color:#fff;
    display:flex;
    align-items:center;
    justify-content:center;
    font-size:24px;
}

.bouee-feature strong{
    display:block;
    color:#07286c;
    font-size:22px;
    margin-bottom:4px;
}

.bouee-feature span{
    display:block;
    color:#20345f;
    font-size:17px;
}

.bouee-arrival{
    margin-top:20px;
    background:#eef4fb;
    border-radius:20px;
    padding:30px;
}

.bouee-arrival .arrival-icon{
    font-size:42px;
    color:#07286c;
    margin-bottom:15px;
}

.bouee-arrival h3{
    margin:0 0 15px;
    color:#07286c;
    font-size:24px;
}

.bouee-arrival p{
    margin:0;
    color:#20345f;
    line-height:1.8;
}

/* ==========================
TABLETTE
========================== */

@media (max-width:1024px){

    .bouee-title{
        font-size:42px;
    }

    .bouee-feature strong{
        font-size:20px;
    }

    .bouee-feature span{
        font-size:16px;
    }

}

/* ==========================
MOBILE
========================== */

@media (max-width:768px){

    .bouee-middle{
        gap:20px;
    }

    .bouee-title{
        font-size:34px;
        text-align:center;
    }

    .bouee-description{
        text-align:center;
        font-size:16px;
    }

    .bouee-feature{
        gap:12px;
    }

    .bouee-icon{
        width:50px;
        height:50px;
        min-width:50px;
        font-size:20px;
    }

    .bouee-feature strong{
        font-size:18px;
    }

    .bouee-feature span{
        font-size:15px;
    }

    .bouee-arrival{
        padding:20px;
    }

    .bouee-arrival h3{
        font-size:20px;
    }

}

/* ==========================
PETIT MOBILE
========================== */

@media (max-width:480px){

    .bouee-title{
        font-size:28px;
    }

    .bouee-description{
        font-size:15px;
    }

    .bouee-feature strong{
        font-size:16px;
    }

    .bouee-feature span{
        font-size:14px;
    }

    .bouee-arrival{
        padding:18px;
    }

}


/* ==========================
COLONNE DROITE
========================== */

.bouee-right{
    display:flex;
    flex-direction:column;
    gap:25px;
}

/* ==========================
TELEPHONE
========================== */

.bouee-phone-card{
    background:#06276c;
    color:#fff;
    border-radius:20px;
    padding:30px;
    text-align:center;
}

.bouee-phone-icon{
    font-size:55px;
    margin-bottom:20px;
}

.bouee-phone-card h2{
    margin:0 0 15px;
    font-size:32px;
    font-weight:800;
}

.bouee-phone-card p{
    color:#ffd323;
    font-size:20px;
    line-height:1.5;
}

.bouee-phone-number{
    font-size:58px;
    font-weight:900;
    margin:30px 0;
}

.bouee-call-btn{
    display:block;
    background:#ffd323;
    color:#06276c;
    text-decoration:none;
    padding:18px;
    border-radius:14px;
    font-size:26px;
    font-weight:800;
}

.bouee-phone-footer{
    margin-top:25px;
    font-size:18px;
}

/* ==========================
AUTRES ACTIVITES
========================== */

.bouee-related{
    background:#fff;
    border-radius:20px;
    padding:25px;
    border:1px solid #dbe4f0;
}

.bouee-related h3{
    text-align:center;
    color:#06276c;
    margin-bottom:25px;
}

.bouee-related-item{
    display:flex;
    align-items:center;
    gap:15px;
    padding:15px 0;
    border-bottom:1px solid #e5e5e5;
}

.bouee-related-item img{
    width:120px;
    height:80px;
    object-fit:cover;
    border-radius:10px;
}

.bouee-related-content{
    flex:1;
}

.bouee-related-content strong{
    display:block;
    color:#06276c;
    margin-bottom:5px;
}

.bouee-related-content span{
    display:block;
    color:#20345f;
}

.bouee-related-arrow{
    width:42px;
    height:42px;
    border-radius:50%;
    background:#06276c;
    color:#fff;
    display:flex;
    align-items:center;
    justify-content:center;
}

.bouee-all-btn{
    display:block;
    margin-top:20px;
    background:#06276c;
    color:#fff;
    text-decoration:none;
    text-align:center;
    padding:16px;
    border-radius:12px;
    font-weight:700;
}

/* ==========================
RESPONSIVE
========================== */

@media(max-width:1024px){

    .bouee-phone-number{
        font-size:42px;
    }

}

@media(max-width:768px){

    .bouee-phone-card{
        padding:20px;
    }

    .bouee-phone-number{
        font-size:32px;
    }

    .bouee-call-btn{
        font-size:18px;
    }

    .bouee-related-item img{
        width:90px;
        height:65px;
    }

}