/*Format mobile*/
.wheel_container{
    display: flex;
    flex-direction: column;
    align-items: center;
    margin-bottom: 75px;
    gap: 60px;
}

.wheel{
    position: relative;
}

.wheel>svg{
    width: 220px;
}



.wheel_text{
    font-family: Bebas Neue, sans-serif;
    text-anchor: middle;
    font-size: 1.25rem;
    fill: var(--title-color);
}



.wheel_img{
    position: absolute;
    top: 4rem;
    left: 2rem;
}



/* Format tablette*/
@media (min-width: 500px) {
    .wheel_container {
        display: grid;
        grid-template-columns: repeat(2, 1fr);
        /* Selectionne les paires (1 et 2, 5 et 6, 9 et 10,etc..) */
        &>*:is(:nth-child(4n + 1), :nth-child(4n + 2)){
            justify-self: flex-start;
        }
        /* Selectionne les paires (3 et 4, 7 et 8, 11 et 12,etc..) */
        &>*:is(:nth-child(4n + 3), :nth-child(4n + 4)){
            justify-self: flex-end;
        }
    }

    .wheelPhama { 
        justify-self: center;
    }
}

@media (min-width: 600px) {
    .wheel_text {
        font-size: 1.5625rem;
    }
}

/* Animation */
@media (min-width: 1024px) {
    .wheel{
        transition: transform .3s;
    }
    .wheel_img {
        transition: transform .5s cubic-bezier(0.54, -0.39, 0.42, 1.14);
    }
    .wheel:hover{
        transform: scale(1.1);
    }

    .wheel:hover .wheel_img {
        transform: rotateZ(90deg);
    }
}

/* Format desktop*/
@media (min-width: 1000px) {
    .wheel_container{
        grid-template-columns: repeat(6, 1fr);
        &>*.wheel{
            justify-self: center;
            grid-column: span 2;
        }
        &>*:is(:nth-child(5n+4)){
            grid-column: 2 / 4;
        }
        &>*:is(:nth-child(5n+2)){
            padding-bottom: 80px;
        }
        &>*:last-child{
            grid-column: -3 / -1;
            padding-bottom: unset;
        }
    }

    .wheel_text{
        font-size: 1.75rem;
    }
}

@media (min-width: 2000px) {
    .wheel_container{
       padding: 0 25%; 
    }
}