.works {
    background-color: #f0f2f5;
    padding: 5.2083333333vw 0;
}

.works__description {
    margin-bottom: 6.7708333333vw;
    max-width: 57.2916666667vw;
    font-size: 1.25vw;
    font-style: normal;
    font-weight: 400;
    line-height: 1;
}

.works__item {
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: flex-start;
    width: 100%;
    background-color: #fff;
    border-radius: 5px;
    padding: 1.5625vw 1.5625vw 2.0833333333vw;
    transition: background-color .3s ease-in;
    cursor: pointer;
}

.works__item:hover {
    background-color: #262e39;
}

.works__item_image {
    position: relative;
    margin-bottom: 1.3020833333vw;
    border-radius: 5px;
    overflow: hidden;
    width: 100%;
}

.works__item_top {
    position: absolute;
    top: 0;
    width: 100%;
    padding: .78125vw;
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: .5208333333vw;
}

.works__item_tags {
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    align-items: center;
    flex-wrap: wrap;
    gap: .5208333333vw;
}

.works__item_tags .tag__item {
    padding: .46875vw .9375vw;
    border-radius: 2.6041666667vw;
    color: #fff;
    font-size: .8333333333vw;
    font-style: normal;
    font-weight: 700;
    line-height: 120%;
}

.works__item_city {
    margin-left: auto;
    border-radius: 1.5625vw;
    background: #f0f2f5;
    display: flex;
    justify-content: center;
    align-items: center;
    padding: .46875vw .9375vw;
    gap: .5208333333vw;
    color: #6f7580;
    font-size: .8333333333vw;
    font-style: normal;
    font-weight: 400;
    line-height: 120%;
    flex-shrink: 0;
}

.works__item_bg {
    width: 100%;
    object-fit: cover;
    aspect-ratio: 72/42;
    border-radius: 5px;
}

.works__item_title {
    font-size: 1.6vw;
    font-style: normal;
    font-weight: 900;
    line-height: 110%;
    margin-bottom: .78125vw;
    background: linear-gradient(90deg,#fe6604 10%,#ee0a76 30%,#ee0a76 60%,#fe6604 101%) repeat-x 0 0;
    background-clip: border-box;
    animation: gusenitsa 70s linear infinite;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

.works__item_description {
    color: #6f7580;
    font-size: 1.0416666667vw;
    font-style: normal;
    font-weight: 400;
    line-height: 120%;
    transition: color .3s ease-in;
}

.works__item:hover .works__item_description {
    color: #fff;
}