.section-img-lits{
    padding: 130px 90px 150px 100px;
}

.bg-img-lits{
    display: grid;
    grid-template-columns: 1fr 1fr 1fr 1fr 1fr;
    grid-template-areas:"bg-card-1 bg-card-2 bg-card-3 bg-card-4 bg-card-5"
                        "bg-card-6 . . . .";
    width: fit-content;
    column-gap: 50px;
    row-gap: 150px;
}
.bg-img-lits > div p{
    background-color: rgba(0, 0, 0, 0.1);
    padding: 10px 0px 10px 10px;
}
.bg-card-1, .bg-card-2, .bg-card-3, .bg-card-4, .bg-card-5, .bg-card-6{
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
}
.card-1, .card-2, .card-3, .card-4, .card-5, .card-6{
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
    height: 100%;
}
.card-1:hover, .card-2:hover, .card-3:hover, .card-4:hover, .card-5:hover, .card-6:hover{
    cursor: pointer !important;
    background-color: transparent;
    transition: 0.5s;
}

.bg-card-1{
    grid-area: bg-card-1;
    background-image: url('https://res.cloudinary.com/dyfvpmg3o/image/upload/v1749221001/lit5_ephqha.jpg');
}
.bg-card-2{
    grid-area: bg-card-2;
    background-image: url('https://res.cloudinary.com/dyfvpmg3o/image/upload/v1749220999/lit4_rjnfbh.jpg');
}
.bg-card-3{
    grid-area: bg-card-3;
    background-image: url('https://res.cloudinary.com/dyfvpmg3o/image/upload/v1749221003/lit6_zctfqs.jpg');
}
.bg-card-4{
    grid-area: bg-card-4;
    background-image: url('https://res.cloudinary.com/dyfvpmg3o/image/upload/v1749221005/lit1_vte7wr.jpg');
}
.bg-card-5{
    grid-area: bg-card-5;
    background-image: url('https://res.cloudinary.com/dyfvpmg3o/image/upload/v1749221008/lit2_q8kvqq.jpg');
}
.bg-card-6{
    grid-area: bg-card-6;
    background-image: url('https://res.cloudinary.com/dyfvpmg3o/image/upload/v1749220997/lit3_iakos0.jpg');
}

.bg-img-lits > div{
    width: 300px;
    height: 400px;
}

.card-1, .card-2, .card-3, .card-4, .card-5, .card-6{
    background-color: rgba(0, 0, 0, 0.4);
}

/* MODAL + CAOURSEL */

.slide-img-1{
    background-image: url('https://res.cloudinary.com/dyfvpmg3o/image/upload/v1749221001/lit5_ephqha.jpg');
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
}
.slide-img-2{
    background-image: url('https://res.cloudinary.com/dyfvpmg3o/image/upload/v1749220999/lit4_rjnfbh.jpg');
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
}
.slide-img-3{
    background-image: url('https://res.cloudinary.com/dyfvpmg3o/image/upload/v1749221003/lit6_zctfqs.jpg');
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
}
.slide-img-4{
    background-image: url('https://res.cloudinary.com/dyfvpmg3o/image/upload/v1749221005/lit1_vte7wr.jpg');
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
}
.slide-img-5{
    background-image: url('https://res.cloudinary.com/dyfvpmg3o/image/upload/v1749221008/lit2_q8kvqq.jpg');
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
}
.slide-img-6{
    background-image: url('https://res.cloudinary.com/dyfvpmg3o/image/upload/v1749220997/lit3_iakos0.jpg');
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
}


#slide1:checked ~ .carousel-track {
    transform: translateX(0%);
}
#slide2:checked ~ .carousel-track {
    transform: translateX(-100%);
}
#slide3:checked ~ .carousel-track {
    transform: translateX(-200%);
}
#slide4:checked ~ .carousel-track {
    transform: translateX(-300%);
}
#slide5:checked ~ .carousel-track {
    transform: translateX(-400%);
}
#slide6:checked ~ .carousel-track {
    transform: translateX(-500%);
}

/* Highlight du thumbnail actif */
#slide1:checked ~ .carousel-thumbnails label[for="slide1"],
#slide2:checked ~ .carousel-thumbnails label[for="slide2"],
#slide3:checked ~ .carousel-thumbnails label[for="slide3"],
#slide4:checked ~ .carousel-thumbnails label[for="slide4"],
#slide5:checked ~ .carousel-thumbnails label[for="slide5"],
#slide6:checked ~ .carousel-thumbnails label[for="slide6"] {
  opacity: 1;
  outline: 2px solid #fff;
}

/* FIN MODAL + CAROUSEL */



/* RESPONSIVE */

@media screen and (max-width: 600px){
    .section-img-lits{
        padding: 100px 0px 100px 0px;
    }
    .bg-img-lits{
        display: grid;
        grid-template-columns: 1fr;
        grid-template-areas:"bg-card-1"
                            "bg-card-2"
                            "bg-card-3"
                            "bg-card-4"
                            "bg-card-5"
                            "bg-card-6";
        row-gap: 130px;
        width: fit-content;
        margin: 0px auto;
        
    }
}

@media screen and (min-width: 1480px) and (max-width: 1600px){
    .bg-img-lits{
        display: grid;
        grid-template-columns: 1fr 1fr 1fr 1fr;
        grid-template-areas:"bg-card-1 bg-card-2 bg-card-3 bg-card-4"
                            "bg-card-5 bg-card-6 . .";
        width: fit-content;
        column-gap: 50px;
        row-gap: 150px;
    }
}
@media screen and (min-width: 1140px) and (max-width: 1480px){
    .bg-img-lits{
        display: grid;
        grid-template-columns: 1fr 1fr 1fr;
        grid-template-areas:"bg-card-1 bg-card-2 bg-card-3"
                            "bg-card-4 bg-card-5 bg-card-6";
        width: fit-content;
        column-gap: 50px;
        row-gap: 150px;
    }
}
@media screen and (min-width: 600px) and (max-width: 1140px){
    .bg-img-lits{
        display: grid;
        grid-template-columns: 1fr 1fr;
        grid-template-areas:"bg-card-1 bg-card-2"
                            "bg-card-3 bg-card-4"
                            "bg-card-5 bg-card-6";
        width: fit-content;
        column-gap: 50px;
        row-gap: 150px;
    }
}
/* FIN RESPONSIVE */