.work-page{background:#fff}
.nav nav a[aria-current="page"]{color:#000;font-weight:600}

.w-hero{max-width:1120px;margin:auto;padding:clamp(60px,10vh,110px) 22px clamp(28px,4vw,44px)}
.w-hero h1{text-align:left;animation:none}
.w-hero p{max-width:620px;margin-top:12px;font-size:clamp(19px,2.2vw,24px);line-height:1.25;color:var(--mute)}

.w-grid{max-width:1120px;margin:auto;padding:0 22px;columns:3 300px;column-gap:18px}
.w-card{display:block;width:100%;margin:0 0 26px;padding:0;background:none;border:0;text-align:left;break-inside:avoid;cursor:pointer;color:inherit}
.w-card[hidden]{display:none}
.w-thumb{position:relative;display:block;overflow:hidden;border-radius:18px;background:var(--bg2)}
.w-thumb img,.w-thumb video{display:block;width:100%;height:100%;object-fit:cover;transition:transform .6s var(--ease)}
.w-thumb video{position:absolute;inset:0;opacity:0;transition:opacity .25s}
.w-card:hover .w-thumb img{transform:scale(1.03)}
.w-card.playing .w-thumb video{opacity:1}
.w-badge{position:absolute;left:12px;bottom:12px;display:flex;align-items:center;gap:6px;padding:5px 11px 5px 9px;background:rgba(0,0,0,.55);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);color:#fff;border-radius:980px;font-size:12px;font-weight:500}
.w-badge svg{width:11px;height:11px;fill:#fff}
.w-card b{display:block;margin-top:12px;font-size:19px;font-weight:600;letter-spacing:-.025em;line-height:1.2}
.w-card small{display:block;margin-top:3px;font-size:14px;color:var(--mute)}
.w-card:focus-visible{outline:none}
.w-card:focus-visible .w-thumb{outline:3px solid var(--accent);outline-offset:3px}

.w-more{margin-top:clamp(50px,8vw,90px);padding:clamp(70px,11vw,130px) 22px;background:var(--bg2);text-align:center}
.w-more h2{font-size:clamp(34px,5vw,56px)}
.w-more p{margin-top:10px;font-size:19px;color:var(--mute)}
.w-more .links{animation:none}

/* lightbox */
.lb{width:min(1180px,calc(100vw - 32px));max-height:calc(100vh - 32px);padding:0;border:0;border-radius:24px;background:#fff;color:var(--ink);overflow:hidden}
.lb::backdrop{background:rgba(0,0,0,.72);backdrop-filter:blur(6px)}
.lb[open]{animation:lbIn .35s var(--ease)}
@keyframes lbIn{from{opacity:0;transform:translateY(16px) scale(.98)}to{opacity:1;transform:none}}
.lb-in{position:relative;display:grid;grid-template-columns:minmax(0,1.5fr) minmax(0,1fr);max-height:calc(100vh - 32px)}
.lb-media{display:flex;align-items:center;justify-content:center;min-height:0;max-height:calc(100vh - 32px);padding:18px;background:#111}
.lb-media video,.lb-media img{display:block;max-width:100%;max-height:calc(100vh - 68px);border-radius:10px;background:#000}
.lb-info{display:flex;flex-direction:column;gap:8px;min-width:0;padding:clamp(24px,3vw,38px);overflow:auto;max-height:calc(100vh - 32px)}
.lb-info h2{font-size:clamp(26px,3vw,36px);line-height:1.1}
.lb-info p{color:#424245;font-size:16px;line-height:1.45}
.lb-info dl{display:grid;grid-template-columns:auto 1fr;gap:6px 16px;margin:10px 0 0;font-size:15px}
.lb-info dt{color:var(--mute)}
.lb-info dd{margin:0}
.lb-credit{font-size:13px!important;color:var(--mute)!important}
.lb-thumbs{display:flex;flex-wrap:wrap;gap:8px;margin-top:6px}
.lb-thumbs button{width:62px;height:62px;padding:0;overflow:hidden;border:2px solid transparent;border-radius:10px;background:var(--bg2)}
.lb-thumbs button.on{border-color:var(--accent)}
.lb-thumbs img{width:100%;height:100%;object-fit:cover;display:block}
.lb-nav{display:flex;gap:8px;margin-top:auto;padding-top:14px}
.lb-x{position:absolute;top:12px;right:12px;z-index:2;width:36px;height:36px;padding:0;border:0;border-radius:50%;background:rgba(0,0,0,.6);color:#fff;font-size:22px;line-height:1}

@media (max-width:560px){
  .w-grid{columns:2;column-gap:12px;padding:0 16px}
  .w-card{margin-bottom:20px}
  .w-thumb{border-radius:14px}
  .w-card b{margin-top:9px;font-size:16px}
  .w-card small{font-size:12.5px}
  .w-badge{left:8px;bottom:8px;padding:4px 9px 4px 8px;font-size:11px}
}
@media (max-width:760px){
  .lb{width:100vw;max-width:100vw;height:100%;max-height:100%;margin:0;border-radius:0}
  .lb-in{display:block;height:100%;max-height:none;overflow:auto}
  .lb-media{max-height:none;padding:12px}
  .lb-media video,.lb-media img{max-height:66vh}
  .lb-info{max-height:none;overflow:visible}
}
@media (prefers-reduced-motion:reduce){
  .lb[open]{animation:none}
  .w-thumb img{transition:none}
}

.lb-go{align-self:flex-start;margin-top:6px;padding:10px 18px;color:#fff;font-size:15px}
.lb-go[hidden]{display:none}
.w-hero .seg{flex-wrap:wrap}