/* Lille Looming 2026 — "Tehtud tööd" page: photo grid + large-photo viewer */

.ll-works>.ll-wrap{padding-top:44px}
.ll-band button.ll-pill-link{cursor:pointer;font-family:var(--ll-sans);line-height:1.4;border:0;margin:0}

/* even grid of photos (cropped to the same shape) */
.ll-wgrid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}
.ll-wtile{display:block;position:relative;aspect-ratio:4/5;border-radius:22px;overflow:hidden;background:var(--ll-blush);cursor:zoom-in}
.ll-wtile[hidden]{display:none}
.ll-wtile img{width:100%!important;height:100%!important;object-fit:cover;object-position:50% 50%;display:block;max-width:none;transition:transform .8s cubic-bezier(.2,.7,.2,1)}
.ll-wtile:hover img{transform:scale(1.04)}
.ll-wcap{position:absolute;left:12px;right:12px;bottom:12px;background:rgba(255,255,255,.92);border-radius:14px;padding:8px 12px;font:400 17px/1.2 var(--ll-serif);color:var(--ll-plum);opacity:0;transform:translateY(6px);transition:opacity .25s,transform .25s}
.ll-wtile:hover .ll-wcap,.ll-wtile:focus-visible .ll-wcap{opacity:1;transform:none}
.ll-wempty[hidden]{display:none}

/* large-photo viewer */
.ll-lightbox{position:fixed;inset:0;z-index:300;background:rgba(32,16,24,.92);display:flex;align-items:center;justify-content:center;padding:24px 72px}
.ll-lightbox[hidden]{display:none}
.ll-lightbox figure{margin:0;display:flex;flex-direction:column;align-items:center;max-width:100%;max-height:100%}
.ll-lightbox img{max-width:min(1100px,100%);max-height:calc(100vh - 110px);width:auto;height:auto;border-radius:16px;box-shadow:0 30px 80px -30px rgba(0,0,0,.7)}
.ll-lightbox figcaption{display:flex;gap:16px;align-items:baseline;margin-top:14px;color:#F6E3EA;font:400 20px var(--ll-serif)}
.ll-lb-count{font:600 13px var(--ll-sans);color:var(--ll-blush3)}
.ll-lightbox button{position:absolute;display:grid;place-items:center;width:48px;height:48px;border-radius:50%;border:0;padding:0;margin:0;background:rgba(255,255,255,.12);color:#fff;font:400 22px/1 var(--ll-sans);cursor:pointer;transition:background .2s}
.ll-lightbox button:hover{background:rgba(255,255,255,.25)}
.ll-lb-close{top:18px;right:18px;font-size:28px!important}
.ll-lb-prev{left:16px;top:50%;transform:translateY(-50%)}
.ll-lb-next{right:16px;top:50%;transform:translateY(-50%)}
body.ll-lb-open{overflow:hidden}

@media (max-width:1000px){
  .ll-works>.ll-wrap{padding-top:28px}
  .ll-wgrid{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
  .ll-wtile{border-radius:16px}
  .ll-wcap{display:none}
  .ll-lightbox{padding:60px 12px 24px}
  .ll-lb-prev,.ll-lb-next{top:auto;bottom:20px;transform:none}
  .ll-lightbox img{max-height:calc(100vh - 170px)}
}