.ux-works-showcase{position:relative;isolation:isolate;overflow:hidden;background:var(--v-bg);border-block:1px solid var(--v-border);padding-block:64px}.ux-works-board{position:absolute;inset:0;width:100%;height:100%;z-index:-1;color:var(--v-cyan);opacity:.68;pointer-events:none;mask-image:linear-gradient(90deg,#000,rgba(0,0,0,.65) 35%,rgba(0,0,0,.45) 65%,#000)}.ux-works-current{filter:drop-shadow(0 0 5px currentColor) drop-shadow(0 0 10px currentColor)}.ux-works-heading{display:flex;align-items:end;justify-content:space-between;gap:24px;margin-bottom:32px}.ux-works-heading>div{max-width:680px}.ux-works-heading h2{margin:8px 0 16px;font-size:clamp(26px,3vw,42px);line-height:1.12}.ux-works-heading p{margin:0;color:var(--v-muted)}.ux-works-heading .btn{flex-shrink:0}.ux-works-kicker{color:var(--v-cyan)!important;font-size:12px;font-weight:800;letter-spacing:.12em}.ux-works-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px}.ux-works-tile{min-width:0;background:var(--v-surface);border:1px solid var(--v-border);border-radius:16px;overflow:hidden;position:relative}.ux-works-tile-video{grid-column:span 2;grid-row:span 2}.ux-works-open{height:100%;display:flex;flex-direction:column;color:var(--v-text);text-decoration:none}.ux-works-open:focus-visible{outline:3px solid var(--v-cyan);outline-offset:-4px;border-radius:16px}.ux-works-preview{position:relative;aspect-ratio:16/10;overflow:hidden;background:var(--v-bg)}.ux-works-preview img{width:100%;height:100%;object-fit:cover;transition:transform .3s}.ux-works-preview:after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,rgba(0,0,0,.55),transparent 65%);pointer-events:none}.ux-works-tile-video .ux-works-preview{flex:1;min-height:300px}.ux-works-label{position:absolute;left:14px;top:14px;z-index:1;background:var(--v-bg);color:var(--v-text);border:1px solid var(--v-border);border-radius:6px;padding:6px 9px;font-size:10px;font-weight:800;letter-spacing:.08em}.ux-works-play{position:absolute;right:16px;bottom:16px;z-index:1;display:grid;place-items:center;width:42px;height:42px;background:var(--v-surface);color:var(--v-text);border:1px solid var(--v-cyan);border-radius:50%;font-size:20px}.ux-works-tile-video .ux-works-play{width:72px;height:72px;font-size:28px;left:50%;top:50%;transform:translate(-50%,-50%);box-shadow:0 0 36px color-mix(in srgb,var(--v-cyan) 35%,transparent)}.ux-works-copy{padding:18px}.ux-works-copy h3{font-size:16px;line-height:1.35;margin:0 0 10px;color:var(--v-text)}.ux-works-copy>span{font-size:12px;color:var(--v-muted)}.ux-works-tile-video h3{font-size:clamp(22px,2vw,30px)}.ux-works-footnote{font-size:13px;margin:24px 0 0;color:var(--v-muted)}.ux-works-dialog{width:min(1320px,calc(100% - 24px));max-height:94dvh;padding:24px;background:var(--v-bg);border:1px solid var(--v-cyan);color:var(--v-text)}.ux-works-dialog::backdrop{background:rgba(0,0,0,.92)}.ux-works-close{margin:0 0 16px auto;display:flex;font-size:26px;padding:4px 16px}.ux-works-dialog-grid{display:grid;grid-template-columns:minmax(0,1.65fr) minmax(0,1fr);gap:28px}.ux-works-dialog-grid>div{min-width:0}.ux-works-full{aspect-ratio:4/3;display:grid;place-items:center;background:var(--v-surface);border-radius:12px;overflow:hidden}.ux-works-full img,.ux-works-full video{width:100%;height:100%;max-height:65dvh;object-fit:contain}.ux-works-controls{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:14px}.ux-works-controls p{margin:0;text-align:center;color:var(--v-muted);font-size:14px}.ux-works-details h2{font-size:clamp(24px,2.5vw,36px);line-height:1.15;overflow-wrap:anywhere}.ux-works-details p{line-height:1.65}.ux-works-details .btn-primary{margin-top:16px}.ux-works-phases{display:flex;gap:10px;flex-wrap:wrap}.ux-works-phases [aria-pressed=true]{outline:2px solid var(--v-cyan);outline-offset:2px}.ux-works-scroll-lock{overflow:hidden}
@media(hover:hover){.ux-works-open:hover img{transform:scale(1.04)}.ux-works-open:hover h3{color:var(--v-cyan)}}
@media(max-width:1000px){.ux-works-heading{align-items:start;flex-direction:column}.ux-works-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.ux-works-dialog-grid{grid-template-columns:1fr}.ux-works-full img,.ux-works-full video{max-height:55dvh}}
@media(max-width:720px){.ux-works-showcase{padding-block:40px}.ux-works-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.ux-works-tile-video{grid-row:span 1}.ux-works-tile-video .ux-works-preview{min-height:0;aspect-ratio:16/9}.ux-works-copy{padding:14px}.ux-works-copy h3{font-size:15px}.ux-works-tile-video h3{font-size:23px}.ux-works-dialog{padding:16px}.ux-works-label{left:10px;top:10px;font-size:9px;padding:5px 7px}}
@media(max-width:360px){.ux-works-grid{grid-template-columns:1fr}.ux-works-tile-video{grid-column:span 1}}
@media(prefers-reduced-motion:reduce){.ux-works-preview img{transition:none}.ux-works-open:hover img{transform:none}.ux-works-current{display:none}}

.ux-works-close{position:sticky;top:0;z-index:2}.ux-works-phases:not(:empty){margin-bottom:16px}.ux-works-play svg{width:22px;height:22px}.ux-works-tile-video .ux-works-play svg{width:32px;height:32px}
@media(min-width:1200px){.ux-works-tile:nth-last-child(-n+2){grid-column:span 2}.ux-works-tile:nth-last-child(-n+2) .ux-works-open{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr)}.ux-works-tile:nth-last-child(-n+2) .ux-works-preview{height:100%}.ux-works-tile:nth-last-child(-n+2) .ux-works-copy{align-self:center}}