.proj { padding:0 24px; max-width:1400px; margin:0 auto; }
.proj-title { font-size:clamp(40px,9vw,120px); font-weight:800; letter-spacing:-0.03em;
  line-height:0.92; text-transform:uppercase; padding:44px 0 22px; color:var(--white); }
.meta { display:grid; grid-template-columns:repeat(4,1fr); gap:18px; padding:0 0 6px; }
.meta div { display:grid; gap:5px; align-content:start; }
.meta dt { font-size:10px; font-weight:700; letter-spacing:normal;
  text-transform:uppercase; color:var(--muted); }
.meta dd { font-size:14px; font-weight:700; color:var(--white); }
.proj-tags { display:flex; gap:14px; flex-wrap:wrap; padding:18px 0 0; }
.proj-desc { font-size:17px; line-height:1.5; max-width:70ch; padding:24px 0 34px;
  color:var(--white); }
.hero { width:100%; background:var(--ink); margin-bottom:8px; }
.hero img, .hero video { width:100%; height:auto; max-height:82vh; object-fit:contain;
  background:var(--ink); margin:0 auto; }
.blocks { display:grid; grid-template-columns:repeat(12,1fr); gap:16px; padding:26px 0 40px; }
.blocks .lab { grid-column:1/-1; font-size:11px; font-weight:700; letter-spacing:normal;
  text-transform:uppercase; padding:24px 0 0; color:var(--muted); }
.blocks .it { grid-column:span 4; }
.blocks .it img, .blocks .it video { width:100%; height:auto; }
.blocks .it img { cursor:zoom-in; }
.blocks .it .ratio { width:100%; overflow:hidden; background:var(--ink); }
.blocks .it .ratio img, .blocks .it .ratio video {
  width:100%; height:100%; object-fit:cover; }
.blocks .it .cap { font-size:10px; font-weight:700; letter-spacing:normal;
  text-transform:uppercase; color:var(--muted); padding-top:8px; }
.row { grid-column:1/-1; display:flex; gap:14px; overflow-x:auto;
  scroll-snap-type:x mandatory; padding-bottom:8px; }
.row img { height:min(60vh,520px); width:auto; max-width:none;
  scroll-snap-align:start; cursor:zoom-in; }
.links { display:flex; gap:18px; flex-wrap:wrap; padding:0 0 34px; }

.pager { display:grid; grid-template-columns:1fr 1fr; padding:26px 0 10px; }
.pager a { padding:30px 24px 46px; display:block; }
.pager a + a { text-align:right; }
.pager a:hover strong { color:var(--red); }
.pager span, .next span { font-size:10px; font-weight:700; letter-spacing:normal;
  text-transform:uppercase; color:var(--muted); }
.pager strong, .next strong { display:block; font-size:clamp(28px,5vw,58px); font-weight:800;
  letter-spacing:-0.02em; text-transform:uppercase; line-height:1; padding-top:8px;
  color:var(--white); transition:color 160ms ease; }

.lb { position:fixed; inset:0; background:rgba(0,0,0,.96); z-index:9500;
  display:flex; align-items:center; justify-content:center; }
.lb[hidden] { display:none; }
.lb img { max-width:92vw; max-height:86vh; width:auto; height:auto; object-fit:contain; }
.lb button { position:absolute; color:var(--white); font-size:12px; font-weight:700;
  letter-spacing:normal; text-transform:uppercase; padding:12px 16px; }
.lb button:hover { color:var(--red); }
.lb .prev { left:8px; } .lb .next-btn { right:8px; }
.lb .close { top:8px; right:8px; }
.lb .count { position:absolute; bottom:14px; left:50%; transform:translateX(-50%);
  color:var(--muted); font-size:11px; font-weight:700; letter-spacing:normal; }
@media (max-width:900px) {
  .proj { padding-left:16px; padding-right:16px; }
  .meta { grid-template-columns:repeat(2,1fr); }
  .blocks .it { grid-column:span 6; }
  .pager a { padding-left:16px; padding-right:16px; }
}
@media (max-width:560px) {
  .meta { grid-template-columns:1fr; }
  .blocks .it { grid-column:1/-1; }
  .pager { grid-template-columns:1fr; }
  .pager a + a { text-align:left; }
}