.works{padding-block:40px 8px}.works__heading-group{flex-direction:column;gap:10px;margin-bottom:20px;display:flex}.works__grid{--works-fade:36px;overscroll-behavior-x:contain;scroll-snap-type:x proximity;scrollbar-width:thin;scrollbar-color:#cfd8e4 transparent;gap:14px;padding-block:6px 14px;display:flex;overflow-x:auto}.works__grid>.work-card{scroll-snap-align:start;flex:0 0 min(78vw,320px)}@property --works-edge-start{syntax:"<number>";inherits:false;initial-value:1}@property --works-edge-end{syntax:"<number>";inherits:false;initial-value:1}.works__grid{-webkit-mask-image:linear-gradient(to right, rgba(0, 0, 0, var(--works-edge-start,1)) 0, #000 var(--works-fade), #000 calc(100% - var(--works-fade)), rgba(0, 0, 0, var(--works-edge-end,1)) 100%);-webkit-mask-image:linear-gradient(to right, rgba(0, 0, 0, var(--works-edge-start,1)) 0, #000 var(--works-fade), #000 calc(100% - var(--works-fade)), rgba(0, 0, 0, var(--works-edge-end,1)) 100%);mask-image:linear-gradient(to right, rgba(0, 0, 0, var(--works-edge-start,1)) 0, #000 var(--works-fade), #000 calc(100% - var(--works-fade)), rgba(0, 0, 0, var(--works-edge-end,1)) 100%)}@keyframes works-fade-start{0%{--works-edge-start:1}to{--works-edge-start:0}}@keyframes works-fade-end{0%{--works-edge-end:0}to{--works-edge-end:1}}@supports (animation-timeline:scroll()){.works__grid{animation:ease-out both works-fade-start,ease-out both works-fade-end;animation-timeline:scroll(self inline),scroll(self inline);animation-range:0 64px,calc(100% - 64px) 100%}}@supports not (animation-timeline:scroll()){.works__grid{--works-edge-start:0;--works-edge-end:0}}@media (prefers-reduced-motion:reduce){.works__grid{--works-edge-start:0;--works-edge-end:0;animation:none}}.work-card{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-lg);transition:transform .2s,box-shadow .2s,border-color .2s;overflow:hidden}.work-card:hover{border-color:#cfd8e4;transform:translateY(-4px);box-shadow:0 14px 30px #101a281a}.work-card .img-placeholder__tag{transition:transform .25s,opacity .25s}.work-card:hover .work-card__images>:first-child .img-placeholder__tag{opacity:.5;transform:scale(.96)}.work-card:hover .work-card__images>:last-child .img-placeholder__tag{transform:scale(1.08)}.work-card__images{background:var(--color-border);grid-template-columns:1fr 1fr;gap:2px;display:grid}.work-card__footer{justify-content:space-between;align-items:center;gap:10px;padding:14px 16px;display:flex}.work-card__title{font:700 15px/1.3 var(--font-heading);color:var(--color-text)}.work-card__meta{font:400 13px/1.3 var(--font-body);color:var(--color-text-faint)}@media (min-width:860px){.works{padding-block:88px 20px}.works__heading-group{margin-bottom:36px}.works__grid{--works-fade:56px;gap:24px}.works__grid>.work-card{flex-basis:calc(33.3333% - 16px)}.work-card__images>*{height:230px}.work-card__footer{padding:18px 20px}.work-card__title{font-size:16px}.work-card__meta{font-size:14px}}