.portfolio-card{transition:transform .55s cubic-bezier(.16,1,.3,1),box-shadow .55s,border-color .45s;background:linear-gradient(145deg,#1c201a,#141713)}
.portfolio-card .work-picture img{aspect-ratio:3/2;object-fit:cover}
.portfolio-card:first-child .work-picture img{aspect-ratio:3/2}
.portfolio-card.portfolio-tall .work-picture img{aspect-ratio:1312/1199;object-fit:contain}
.portfolio-card .work-caption{position:relative}
.portfolio-card .work-caption:before{content:'';position:absolute;left:0;top:0;width:1px;height:0;background:linear-gradient(var(--copper-light),transparent);transition:height .6s cubic-bezier(.16,1,.3,1)}
.portfolio-card .work-meta span:first-child{transition:color .35s,letter-spacing .45s}
#work-count strong{color:var(--copper-light);font-weight:500;margin-right:3px}
@media(hover:hover) and (pointer:fine){
  .portfolio-card:hover{transform:translateY(-7px);box-shadow:0 24px 60px #0005;border-color:#bc93745c}
  .portfolio-card:hover .work-caption:before{height:100%}
  .portfolio-card:hover .work-meta span:first-child{color:var(--copper-light);letter-spacing:1.4px}
}
@media(max-width:700px){.portfolio-card:hover{transform:none}.portfolio-card .work-picture img,.portfolio-card:first-child .work-picture img{aspect-ratio:3/2}.portfolio-card.portfolio-tall .work-picture img{aspect-ratio:1312/1199}}
@media(prefers-reduced-motion:reduce){.portfolio-card,.portfolio-card .work-caption:before,.portfolio-card .work-meta span:first-child{transition:none!important}.portfolio-card:hover{transform:none}}