html{--mainColor:#dac5a7;--mainColor-subtle:hsla(35,41%,75%,.6);--mainColor-subtle-opaque:#1a1412;--mainColor-muted:hsla(35,41%,75%,.15);--mainColor-hint:hsla(35,41%,75%,.05);--mainColor-hint-opaque:#181715;--bgColor:#0e0e0e;--bgColor-transparent:hsla(0,0%,5%,.98);--secondaryColor:#0e0e0e;--secondaryFontFamily:$secondaryFontFamily}.works{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(28.125rem,100%),1fr))}.item-work{overflow:hidden;position:relative;transition:opacity .5s}.item-work__image{aspect-ratio:684/513;display:block;position:relative;transition:all .3s}.item-work__image:after{background:url(../assets/img/works/noise.webp) 50%/cover no-repeat;content:"";height:100%;left:0;position:absolute;top:0;width:100%}.item-work__image-item{height:100%;object-fit:cover;width:100%}.item-work__body{align-items:center;backdrop-filter:blur(.9375rem);background:var(--mainColor-hint);border:.0625rem solid var(--mainColor-muted);border-radius:.125rem;display:flex;flex-wrap:wrap;gap:.3125rem;justify-content:space-between;padding:1rem .75rem;position:absolute}.item-work__name{font-weight:300;letter-spacing:.0625rem;line-height:1.291667}.item-work__category,.item-work__name{color:var(--mainColor-subtle);font-family:Satoshi,sans-serif}.item-work__category{font-size:.8125rem;font-weight:400;letter-spacing:.09375rem;line-height:1.615385;text-transform:uppercase;transition:all .3s}.item-work__name-link{transition:all .3s}@media (width <= 20em){.works{gap:1.25rem}.item-work__body{bottom:.625rem;left:.625rem;right:.625rem}.item-work__name{font-size:1.125rem}}@media (width > 20em) and (width <= 87.5em){.works{gap:clamp(1.25rem,1.027777777775rem + 1.1111111111vw,2rem)}.item-work__body{bottom:clamp(.625rem,.21759259259375rem + 2.037037037vw,2rem);left:clamp(.625rem,.21759259259375rem + 2.037037037vw,2rem);right:clamp(.625rem,.21759259259375rem + 2.037037037vw,2rem)}.item-work__name{font-size:clamp(1.125rem,1.0138888888875rem + .5555555556vw,1.5rem)}}@media (width > 87.5em){.works{gap:2rem}.item-work__body{bottom:2rem;left:2rem;right:2rem}.item-work__name{font-size:1.5rem}}@media (any-hover:hover){.item-work:hover .item-work__image{scale:1.05}.item-work__category:hover,.item-work__name-link:hover{color:var(--mainColor)}}