:root{--clr-neutral-900:#13171b;--clr-neutral-100:#fff;--clr-accent-400:#42f584}.card{color:var(--clr-neutral-100);background-image:url(https://media.contentapi.ea.com/content/dam/eacom/images/2020/09/ea-featured-image-ea-desktop-beta.jpg.adapt.crop191x100.1200w.jpg);background-size:cover;padding:10rem 0 0;max-width:35ch;border-radius:.5rem;overflow:hidden;transition:transform .5s ease}.card:focus-within,.card:hover{transform:scale(1.05)}.card-content{--padding:1.5rem;padding:var(--padding);background:linear-gradient(transparent,rgba(0,0,0,.3) 20%,#000)}.card-title{position:relative;width:max-content;font-family:Kalnia}.card:focus-within .card-title:after,.card:hover .card-title:after{transform:scaleX(1)}.card-title:after{content:"";position:absolute;height:4px;width:calc(100% + var(--padding));left:calc(var(--padding) * -1);bottom:-2px;background:var(--clr-accent-400);transform-origin:left;transition:transform .5s ease}@media (hover){.card-content{transform:translateY(65%);transition:transform .5s ease}.card-content>:not(.card-title){opacity:0;transition:opacity .5s linear}.card:focus-within .card-content>:not(.card-title),.card:hover .card-content>:not(.card-title){opacity:1;transition-delay:.7s}.card:focus-within .card-content,.card:hover .card-content{transform:translateY(0);transition-delay:.5s}.card:focus-within .card-content{transition-duration:0ms}.card-title:after{transform:scaleX(0)}}.button{cursor:pointer;display:inline-block;text-decoration:none;color:var(--clr-neutral-900);background-color:#deb887;padding:.25em .75em;border-radius:.25rem}.button:focus,.button:hover{background-color:var(--clr-neutral-100)}.card-body{color:rgb(255,255,255/.85);font-family:Ubuntu}@media (prefers-reduced-motion:reduce){*,:after,:before{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important;transition-delay:0ms!important}}