.categories{margin:4rem 0}.categories li{display:inline-block;padding:0 .5rem;text-transform:uppercase;cursor:pointer;transition:background-color 1s cubic-bezier(.43,.26,.13,1.01)}.cards{display:grid;grid-gap:2rem;margin-bottom:4rem}@media screen and (min-width:640px){.cards{display:grid;grid-template-columns:repeat(2,1fr);margin-bottom:4rem}}@media screen and (min-width:960px){.cards{grid-gap:4rem}}.cards>span{display:contents}.cards-enter{transform:scale(.5) translatey(-80px);opacity:0}.cards-leave-to{transform:translatey(30px);opacity:0}.cards-leave-active{position:absolute;z-index:-1}.card{position:relative;display:block;overflow:hidden;cursor:pointer;height:400px;transition:all .35s ease-in-out}.card .card__img{position:absolute;top:0;left:0;width:100%;-o-object-fit:cover;object-fit:cover;-o-object-position:50% 50%;object-position:50% 50%}.card .card__info{position:absolute;z-index:9;bottom:0;right:0;margin:2rem;pointer-events:none;color:#fff}@media screen and (min-width:960px){.card .card__info{color:#fff}}.card .card__title{margin-bottom:0}@media screen and (min-width:960px){.card .card__title span{display:inline-block;transform:translateY(100%);transition:transform .75s cubic-bezier(.43,.26,.13,1.01)}}@media screen and (min-width:960px){.card .card__title{overflow:hidden}}.card .card__category{font-size:1.25rem;margin-bottom:0}@media screen and (min-width:960px){.card .card__category span{display:inline-block;transform:translateY(100%);transition:transform .5s cubic-bezier(.43,.26,.13,1.01)}}@media screen and (min-width:960px){.card .card__category{overflow:hidden}}@media screen and (min-width:960px){.card:hover .card__title span{transform:translateY(0)}}.card:hover .card__category span{transform:translateY(0)}