.games__inner{
    display: flex;
    flex-direction: column;
    gap: 48px;
}

.games__title-block{
    display: flex;
    align-items: center;
    gap: 12px;
}
.games__title-block span{
    font-family:"Onest-Medium";
    font-weight:500;
    font-size: 20px;
    text-transform:uppercase;
}
.games__list{
    padding-top: 12px;
}
.games__block-img{
    border-radius:12px;
    overflow:hidden;
    /* width: 291px; 
    height: 184px; */
}
.games__list-1{
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 12px;
}
.games__list-2{
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    grid-template-rows: 1fr 1fr 1fr;
    gap: 12px;
    grid-template-areas:
      ". . big-img big-img"
      ". . big-img big-img"
      ". . . ."
      ". . . ."
      "big-img-2 big-img-2 . ."
      "big-img-2 big-img-2 . ."
      ". . . .";
}

.games__list-3{
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    grid-template-rows: 1fr 1fr 1fr;
    gap: 12px;
    grid-template-areas:
      ". . big-img-3 big-img-3"
      ". . big-img-3 big-img-3"
      ". . . ."
      ". . . .";
}
.big-img {
    grid-area: big-img;
}
.big-img-2 {
    grid-area: big-img-2;
}
.big-img-3 {
    grid-area: big-img-3;
}

.games__block-img img{
    width: 100%;
    height: auto;
}

@media(max-width:1025px){
    .games__list-2{
        display: grid;
        grid-template-columns: repeat(3, 1fr);
        grid-template-rows: auto;
        gap: 12px;
        grid-template-areas:
          ". . ."
          "big-img big-img ."
          "big-img big-img ."
          ". . . "
          ". . . "
          ". big-img-2 big-img-2"
          ". big-img-2 big-img-2"
          ;
    }
    .games__img{width: 100%;}
    .games__list-3{
        display: grid;
        grid-template-columns: repeat(3, 1fr);
        grid-template-rows: auto;
        gap: 12px;
        grid-template-areas:
          ". . ."
          "big-img-3 big-img-3 ."
          "big-img-3 big-img-3 ."
          ". . .";
    }
}

@media(max-width:669px){
    .games__list-2{
        display: grid;
        grid-template-columns: repeat(2, 1fr);
        grid-template-rows: auto;
        gap: 12px;
        grid-template-areas:
          ". . "
          ". . "
          "big-img big-img"
          "big-img big-img"
          ". . "
          ". . "
          ". . "
          ". . "
          ". . "
          "big-img-2 big-img-2"
          "big-img-2 big-img-2"
          ". . "
          ;
    }
    .games__list-3{
        display: grid;
        grid-template-columns: repeat(2, 1fr);
        grid-template-rows: auto;
        gap: 12px;
        grid-template-areas:
          ". ."
          ". ."
          "big-img-3 big-img-3"
          "big-img-3 big-img-3"
          ". .";
    }
}

@media(max-width:360px){
    .games__list-2,.games__list-3{display: flex;flex-wrap: wrap;}
    .games__item{flex-grow: 1}
}