.games-slider__images {
    margin-top: 1rem;
    display: flex;
    gap: 0;
    padding: 0;
    overflow-x: hidden; 
}

.games-slide {
    flex: 0 0 auto; 
    text-align: left;
    width: 100vw; 
    transition: transform 800ms cubic-bezier(0.075, 0.82, 0.165, 1);
}

.games-slide__image {
    width: 100%;
    object-fit: cover;
    aspect-ratio: 2/1;
    transition: filter 200ms ease;
}

.games-slide__subtitle {
    color: var(--tint);
    margin:1rem 0 2rem 1rem;
    font-family: "Fira Sans";
    font-size: 1.1rem;
}

.games-slider {
    position: relative;
}

.game-slider__buttons {
    display: flex;
    justify-content:center;
    gap: 0.5rem;
    
}

.game-slider__buttons a {
    display: block;
    content: "";
    width: 0.5rem;
    height: 0.5rem;
    border-radius: 50%;
    transition: all 500ms ease;
    cursor: pointer;
}

.unselected {
    background-color: var(--subtle);
}

.selected {
    background-color: var(--contrast);
}

.games-slider__previous,
.games-slider__next {
    cursor: pointer;
    position: absolute;
    top: 42%;
    border: none;
    background-color: hsla(0, 0%, 0%, 0);
    img {
        width: 2.5rem;
    }
}

.games-slider__previous {
    left: 1rem;    
}

.games-slider__next {
    right: 1rem;
}
    
.games-content {
    margin-bottom: 1rem;
    border-bottom: 1px solid var(--subtle);  
}

.games-content__text {
    font-family: "Fira Sans";
    font-size: 1.1rem;
    line-height: 2rem;
    margin: 1.5rem;
    color: var(--tint);
}

.games-content__text a {
    
    color: var(---subtle);
    font-weight: 600;
}

.games-mentions {
    font-family: "Fira Sans";
    margin: 3rem 1rem;
}

.games-mentions__title {
    font-weight: 400;
    font-size: 2rem;
    padding-bottom: 0.8rem;
}
.games-mentions__text {
    color: var(--tint);
    font-size: 1.2rem;
    line-height: 2rem;
    padding-bottom: 2rem;
}

figure figcaption{
    color: var(--tint);
    padding-top: 0.5rem;
    font-family: "Fira Sans";
    font-size: 1.1rem;
}

.games-mentions__card__subtitle {
    color: var(--tint);
    margin:1rem 0 2rem 0;
    font-family: "Fira Sans";
    font-size: 1.1rem;
}

.games-mentions__zoom {
    display: none;
}

.inactive {
    display: none;
}

@media (min-width: 64rem) {
    .games-content .games-content__text {
        width: 35rem;
        padding: 2rem 0 5rem 0;
        margin: auto;
    }

    .games-mentions {
        margin: 3rem 5.5rem;
    }

    .games-mentions__text,
    .games-mentions__title {
        width: 35rem;
        margin: auto;
    }

    .games-mentions__grid {
        display: flex;
        flex-direction: row;
        gap: 1.5rem;
    }

    .games-mentions__card {
        width: 100%;
    }

    .games-mentions__card__image {
        object-fit: cover;
        cursor: pointer;
    }

    .games-slider__images {
        display: flex;
        gap: 2.5rem;
        padding-left: 5rem;
        gap: 2.5rem;
    }

    .close-zoom {
        cursor: pointer;
        position: fixed;
        opacity: 1;
        z-index: 10;
        right: 5rem;
        top: 1.5rem;
        background-color: hsla(0, 0%, 0%, 0);
        border: none;
    }

    .games-mentions__zoom {
        display: block;
    }

    .games-mentions__zoom div{
        position: fixed;
        top: 0;
        left: 0;
        width: 100vw;
        height: 100vh;
        z-index: 1;
    }

    .games-mentions__zoom div:before{
        position: absolute;
        content: '';
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        background-color: var(--base);
        opacity: 0.5;
        z-index: -1;
    }

    .games-mentions__zoom div img {
        width: 50rem;
        z-index: 1;
        margin: 12rem auto;
    }

    .out-focus {
        filter:opacity(50%);
    }

    .games-slide {
        max-width: 64%;
    }
}