.work-layout{position:relative;isolation:isolate;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,2fr);align-items:center;overflow:hidden;background:#0a1119}.work-layout::before{content:"";position:absolute;inset:-30px;background-image:var(--work-background,none);background-size:cover;background-position:center;filter:blur(22px);opacity:.2;z-index:-2;pointer-events:none}.work-layout::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,#05090bd9,transparent);z-index:-1;pointer-events:none}.work-info{position:relative;padding:35px 32px 35px max(5vw,calc((100vw - 1400px)/2));min-width:0}.work-info>span{font-size:11px;color:#affb1a;letter-spacing:.1em}.work-info h3{font-size:clamp(30px,3.6vw,60px);line-height:1.04;letter-spacing:-.025em;overflow-wrap:anywhere;margin:18px 0}.work-info p{font-size:16px;line-height:1.65;color:#a6b0b5;max-width:420px}.work-viewport{position:relative;height:clamp(430px,39vw,620px);padding:48px 0;overflow:hidden;touch-action:pan-y pinch-zoom;clip-path:polygon(var(--work-edge,120px) 0,100% 0,100% 100%,0 100%);cursor:grab;min-width:0}.work-viewport:focus-visible{outline:1px solid #affb1a;outline-offset:-2px}.work-track{display:flex;width:max-content;height:100%;gap:7px;align-items:center}.work-card{position:relative;display:block;flex:0 0 var(--work-width,360px);width:var(--work-width,360px);height:100%;margin-right:var(--work-overlap,-120px);pointer-events:none}.work-card-inner{position:absolute;inset:0;clip-path:polygon(33.2437% 0,100% 0,66.7563% 100%,0 100%);transition:transform .3s,filter .3s;pointer-events:auto;overflow:hidden}.work-card-inner img{display:block;width:100%;height:100%;object-fit:cover;filter:brightness(.75);pointer-events:none}.work-card.work-active{z-index:3}.work-card.work-active .work-card-inner{transform:scale(1.16)}.work-card.work-active img{filter:brightness(1.05)}.work-card-title{display:none}.work-card-inner::after{content:"";position:absolute;inset:0;pointer-events:none;opacity:0;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 300 400' preserveAspectRatio='none'%3E%3Cpolygon points='100,1 299,1 200,399 1,399' fill='none' stroke='%23affb1a' stroke-width='1.5' vector-effect='non-scaling-stroke'/%3E%3C/svg%3E") center/100% 100% no-repeat}.work-active .work-card-inner::after{opacity:1}
@media(max-width:760px),(hover:none) and (pointer:coarse){.work-layout{display:block;width:100%}.work-info{display:none}.work-viewport{height:clamp(430px,125vw,590px);padding:40px 0;clip-path:none;width:100%}.work-card-inner{transform:none}.work-card.work-active .work-card-inner{transform:scale(1.12)}.work-card-title{display:flex;align-items:flex-end;position:absolute;inset:0;padding:22px calc(33.2437% + 8px) 24px 18px;color:#fff;font-size:clamp(16px,4.6vw,23px);line-height:1.12;font-weight:700;background:linear-gradient(transparent 45%,#000d);opacity:0;pointer-events:none}.work-active .work-card-title{opacity:1}}
@media(prefers-reduced-motion:reduce){.work-card-inner{transition:none}}
.work-viewport.work-dragging{cursor:grabbing}.work-viewport,.work-card{-webkit-user-select:none;user-select:none}.work-card img{-webkit-user-drag:none}
