/* asmixo: all-work page */
.wk-nav{position:sticky;top:0;z-index:100;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:14px var(--pad);background:rgba(242,243,245,.82);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px)}
.wk-nav .nav-logo{pointer-events:auto}
.wk-back{display:inline-flex;align-items:center;gap:8px;height:42px;padding:0 18px;border-radius:999px;background:var(--ink);color:#fff;font-weight:600;font-size:14px;transition:background .25s,transform .3s var(--ease)}
.wk-back:hover{background:var(--blue);transform:translateX(-3px)}
.wk-nav .nav-cta{pointer-events:auto}

.wk-hero{padding:clamp(40px,7vw,96px) var(--pad) 28px}
.wk-h{font-size:clamp(64px,11vw,176px);font-weight:600;letter-spacing:-.065em;line-height:.88;animation:wkUp 1s var(--ease) both}
.wk-h .script{font-weight:400;letter-spacing:0;color:var(--blue);font-size:1.05em;margin-left:.04em}
.wk-sub{margin-top:22px;max-width:56ch;font-size:clamp(16px,1.3vw,19px);color:var(--ink-2);animation:wkUp 1s var(--ease) .12s both}
.wk-filters{display:flex;flex-wrap:wrap;gap:8px;margin-top:34px;animation:wkUp 1s var(--ease) .22s both}
.wk-filters button{height:42px;padding:0 16px;border-radius:999px;border:1px solid var(--line);background:var(--white);font:inherit;font-size:14px;font-weight:600;color:var(--ink);cursor:pointer;transition:background .25s,color .25s,border-color .25s,transform .3s var(--ease)}
.wk-filters button sup{font-family:var(--mono);font-size:10px;font-weight:400;color:var(--grey);margin-left:3px;vertical-align:.5em}
.wk-filters button:hover{transform:translateY(-2px);border-color:var(--ink)}
.wk-filters button.on{background:var(--ink);color:#fff;border-color:var(--ink)}
.wk-filters button.on sup{color:rgba(255,255,255,.6)}
@keyframes wkUp{from{opacity:0;transform:translateY(30px)}}

.wk-grid{padding:10px var(--pad) 0;columns:4 260px;column-gap:14px}
.wk-card{position:relative;break-inside:avoid;margin:0 0 14px;border-radius:var(--r-sm);overflow:hidden;background:#e6e8ec;aspect-ratio:var(--ar);cursor:zoom-in;opacity:0;transform:translateY(40px);transition:opacity .8s var(--ease) var(--d,0ms),transform .9s var(--ease) var(--d,0ms),box-shadow .35s}
.wk-card.in{opacity:1;transform:none}
.wk-card img,.wk-card video{width:100%;height:100%;object-fit:cover;display:block;transition:transform .8s var(--ease),filter .5s}
.wk-card:hover img,.wk-card:hover video{transform:scale(1.04)}
.wk-card:hover{box-shadow:0 24px 50px -28px rgba(7,8,12,.5)}
.wk-card:focus-visible{outline:3px solid var(--blue);outline-offset:3px}
.wk-card figcaption{position:absolute;left:10px;bottom:10px;font-family:var(--mono);font-size:10px;letter-spacing:.08em;text-transform:uppercase;color:#fff;background:rgba(7,8,12,.62);backdrop-filter:blur(8px);padding:5px 9px;border-radius:999px;opacity:0;transform:translateY(6px);transition:opacity .3s,transform .35s var(--ease)}
.wk-card:hover figcaption,.wk-card:focus-visible figcaption{opacity:1;transform:none}
.wk-play{position:absolute;right:10px;top:10px;width:28px;height:28px;border-radius:50%;background:rgba(255,255,255,.9);color:var(--ink);display:grid;place-items:center}
.wk-more{text-align:center;padding:26px 0 10px}

.wk-cta{margin:70px var(--gut) 0;background:var(--ink);color:#fff;border-radius:var(--r);padding:clamp(56px,8vw,110px) var(--pad);position:relative;overflow:hidden}
.wk-cta::before{content:"";position:absolute;right:-10%;top:-40%;width:60vw;height:60vw;background:radial-gradient(closest-side,rgba(0,123,255,.3),transparent);pointer-events:none}
.wk-cta-h{position:relative;font-size:clamp(38px,5.4vw,84px);font-weight:600;letter-spacing:-.055em;line-height:.95;max-width:16ch}
.wk-cta-h .script{font-weight:400;letter-spacing:0;font-size:1.1em}
.blue{color:var(--blue)}
.wk-cta-b{position:relative;display:flex;flex-wrap:wrap;gap:10px;margin-top:30px}
.wk-foot{padding-top:10px}
.wk-foot a:hover{color:var(--blue)}

/* lightbox */
.lb{position:fixed;inset:0;z-index:300;background:rgba(7,8,12,.94);display:grid;grid-template-columns:72px 1fr 72px;grid-template-rows:1fr auto;align-items:center;justify-items:center;padding:56px 10px 18px}
.lb[hidden]{display:none}
html.lb-open,html.lb-open body{overflow:hidden}
.lb-stage{grid-column:2;grid-row:1;width:100%;height:100%;display:grid;place-items:center;min-height:0}
.lb-stage img,.lb-stage video{max-width:100%;max-height:calc(100vh - 130px);border-radius:12px;object-fit:contain;box-shadow:0 30px 80px -30px #000}
.lb-stage.pop img,.lb-stage.pop video{animation:lbPop .45s var(--ease)}
@keyframes lbPop{from{opacity:0;transform:scale(.96)}}
.lb-nav,.lb-x{width:52px;height:52px;border-radius:50%;border:1px solid rgba(255,255,255,.18);background:rgba(255,255,255,.06);color:#fff;display:grid;place-items:center;cursor:pointer;transition:background .25s}
.lb-nav:hover,.lb-x:hover{background:var(--blue);border-color:var(--blue)}
.lb-prev{grid-column:1;grid-row:1}
.lb-next{grid-column:3;grid-row:1}
.lb-x{position:absolute;right:14px;top:10px;width:44px;height:44px}
.lb-cap{grid-column:1/-1;grid-row:2;font-family:var(--mono);font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:rgba(255,255,255,.7);padding-top:12px;white-space:pre}

@media (max-width:700px){
  .wk-nav .nav-cta span{display:none}
  .wk-nav .nav-cta{padding:5px}
  .wk-back{padding:0 14px}
  .wk-grid{columns:2;column-gap:8px}
  .wk-card{margin-bottom:8px}
  .wk-card figcaption{display:none}
  .lb{grid-template-columns:1fr;padding:56px 8px 14px}
  .lb-stage{grid-column:1}
  .lb-nav{position:absolute;bottom:14px;width:46px;height:46px}
  .lb-prev{left:14px}.lb-next{right:14px}
  .lb-cap{padding-bottom:6px}
}
@media (prefers-reduced-motion:reduce){.wk-card{opacity:1;transform:none;transition:none}}