/* lk-gallery · сетка обложек + колода.
   Текст — только стиль «Утилита» сайта: Onest 500, заглавные; 14/17 трекинг 1.12 (≥1200), 11/17 и 0.88 (640–1199), 11/13 и 0.88 (телефон). Общая для всех кейсов: DAYARAD, Инфографика, Amazon.
   Отступы и скругления сняты с живой страницы /projects/dayarad:
   1440 → колонка 320, зазор 20, скругление 20 · 1024 → 233 / 12 / 12 · 390 → 2 колонки 175 / 8 / 8 */
.lk-gal,.lk-v{--u-fs:11px;--u-lh:17px;--u-ls:.88px}
@media (min-width:1200px){.lk-gal,.lk-v{--u-fs:14px;--u-lh:17px;--u-ls:1.12px}}
@media (max-width:639px){.lk-gal,.lk-v{--u-fs:11px;--u-lh:13px;--u-ls:.88px}}
.lk-gal{--r:3/4;--gap:12px;--rad:12px;--pad:28px;list-style:none;margin:0 auto;padding:0 var(--pad);display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:var(--gap);font-family:Onest,Arial,sans-serif;color:#0C0C0C}
.lk-gal[data-ratio="1/1"]{--r:1/1}
.lk-gal.lk-gal--empty{display:none}
.lk-gal>li{margin:0;padding:0;min-width:0}
.lk-gal__card{margin:0;position:relative}
.lk-gal__cover{display:block;position:relative;aspect-ratio:var(--r);border-radius:var(--rad);overflow:hidden;background:#EFEFEC;transform:translateZ(0);transition:transform .5s cubic-bezier(.165,.84,.44,1)}
.lk-gal__cover img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block;margin:0}
.lk-gal__cover .lk-gal__next{opacity:0;transition:opacity .6s ease}
.lk-gal__cover .lk-gal__next.on{opacity:1}
.lk-gal__cover:focus-visible{outline:2px solid #E83600;outline-offset:3px}
.lk-gal__n{position:absolute;left:12px;bottom:12px;z-index:2;padding:8px 12px;border-radius:100px;background:rgba(12,12,12,.72);color:#F9F9F9;font:500 var(--u-fs)/var(--u-lh) Onest,Arial,sans-serif;letter-spacing:var(--u-ls);text-transform:uppercase;font-variant-numeric:tabular-nums;white-space:nowrap}
.lk-gal__bar{position:absolute;left:12px;right:12px;top:12px;z-index:2;display:flex;gap:3px;opacity:0;transition:opacity .3s}
.lk-gal__bar i{flex:1;height:2px;border-radius:2px;background:rgba(255,255,255,.6);box-shadow:0 0 0 .5px rgba(12,12,12,.08)}
.lk-gal__bar i.on{background:#0C0C0C}
.lk-gal__cover.cycling .lk-gal__bar{opacity:1}
/* название видно в колоде, под обложкой скрыто — но остаётся в HTML для поисковиков */
.lk-gal__name{position:absolute!important;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
.lk-gal__covers,.lk-gal__slides{display:none!important}
@media (hover:hover){.lk-gal__cover:hover{transform:translateY(-4px)}}
@media (min-width:1200px){.lk-gal{--pad:50px;--gap:calc((100vw - 100px)*16/1100);--rad:calc((100vw - 100px)*16/1100)}}
@media (min-width:640px) and (max-width:959px){.lk-gal{--pad:20px;grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (max-width:639px){
  .lk-gal{--pad:16px;--gap:8px;--rad:8px;grid-template-columns:repeat(2,minmax(0,1fr))}
  .lk-gal__n{left:8px;bottom:8px;padding:6px 9px}
  .lk-gal__bar{left:8px;right:8px;top:8px}
}

/* просмотрщик */
html.lk-lock,html.lk-lock body{overflow:hidden!important}
.lk-v{--r:.75;position:fixed;inset:0;z-index:2147482000;display:none;font-family:Onest,Arial,sans-serif;color:#0C0C0C}
.lk-v.on{display:block}
.lk-v__scrim{position:absolute;inset:0;background:#F9F9F9;opacity:0}
.lk-v__panel{position:absolute;inset:0;display:grid;grid-template-columns:minmax(0,1fr);grid-template-rows:auto minmax(0,1fr) auto}
.lk-v__bar{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:20px clamp(16px,4vw,50px);opacity:0}
.lk-v__who{display:flex;gap:16px;align-items:baseline;min-width:0}
.lk-v__nm,.lk-v__cnt,.lk-v__seg button{font:500 var(--u-fs)/var(--u-lh) Onest,Arial,sans-serif;letter-spacing:var(--u-ls);text-transform:uppercase;font-variant-numeric:tabular-nums}
.lk-v__nm{color:#0C0C0C;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.lk-v__cnt{color:#777;white-space:nowrap}
.lk-v__stage{position:relative;min-width:0;min-height:0;overflow:hidden}
.lk-v__rail{--sw:min(44vw,58vh);height:100%;width:100%;display:flex;align-items:center;gap:clamp(12px,2vw,28px);overflow-x:auto;overflow-y:hidden;scroll-snap-type:x mandatory;padding-inline:calc(50% - var(--sw)/2);scrollbar-width:none;cursor:grab;outline:none;box-sizing:border-box}
.lk-v__rail::-webkit-scrollbar{display:none}
.lk-v__rail.drag{cursor:grabbing;scroll-snap-type:none}
.lk-v__rail.lk-nosnap{scroll-snap-type:none!important;overflow-x:hidden}   /* пока колода раскладывается — без привязки, иначе телефон прыгает на случайный слайд */
.lk-v__s{position:relative;flex:0 0 var(--sw);aspect-ratio:var(--ar,3/4);border-radius:16px;overflow:hidden;background:#EFEFEC;scroll-snap-align:center;opacity:0}
.lk-v__s img{width:100%;height:100%;object-fit:cover;display:block;pointer-events:none;user-select:none;-webkit-user-drag:none}
.lk-v__s.last-cover{margin-right:clamp(24px,6vw,96px)}
.lk-v__foot{display:grid;justify-items:center;gap:14px;padding:12px clamp(16px,4vw,50px) 24px;opacity:0}
.lk-v__seg{display:flex;gap:8px}
.lk-v__seg button{appearance:none;color:#0C0C0C;background:none;border:1px solid #D8D8D8;border-radius:100px;padding:8px 16px;cursor:pointer;transition:background .25s,color .25s,border-color .25s;font-variant-numeric:tabular-nums}
.lk-v__seg button:hover{border-color:#0C0C0C}
.lk-v__seg button.on{background:#0C0C0C;border-color:#0C0C0C;color:#F9F9F9}
.lk-v__seg span{opacity:.55;margin-left:6px}
.lk-v__who{gap:16px}
.lk-v__thumbs{position:relative;display:flex;justify-content:center;align-items:center;gap:6px;flex-wrap:wrap;max-width:100%}
.lk-v__div{width:1px;height:28px;background:#D8D8D8;margin:0 8px;flex:0 0 auto}
.lk-v__t{appearance:none;border:0;padding:0;background:#EFEFEC;cursor:pointer;width:34px;aspect-ratio:var(--ar,3/4);border-radius:5px;overflow:hidden;opacity:.45;transition:opacity .25s,box-shadow .25s}
.lk-v__t img{width:100%;height:100%;object-fit:cover;display:block}
.lk-v__t.on{opacity:1;box-shadow:0 0 0 1.5px #0C0C0C}
.lk-v__t:hover{opacity:.85}
/* кнопки — как .lk-drum__кнопка на страницах услуг */
.lk-v__btn{box-sizing:border-box;width:48px;height:48px;min-width:48px;min-height:48px;flex:0 0 auto;padding:0;margin:0;line-height:0;appearance:none;border-radius:50%;border:1px solid #D8D8D8;background:none;color:#0C0C0C;display:grid;place-items:center;cursor:pointer;transition:border-color .25s,background .25s,transform .25s,opacity .25s}
.lk-v__btn:hover{border-color:#0C0C0C;background:rgba(12,12,12,.04)}
.lk-v__btn:active{transform:scale(.94)}
.lk-v__btn:focus-visible{outline:2px solid #E83600;outline-offset:2px}
.lk-v__btn svg{width:15px;height:15px}
.lk-v__btn[disabled]{opacity:.3;pointer-events:none}
.lk-v__nav{position:absolute;top:50%;margin-top:-24px;z-index:400;background:rgba(249,249,249,.9)}
.lk-v__nav:hover{background:#F2F2F2}
.lk-v__prev{left:clamp(12px,3vw,40px)}.lk-v__next{right:clamp(12px,3vw,40px)}
.lk-v__ghost{position:fixed;z-index:2147483000;left:0;top:0;border-radius:16px;overflow:hidden;pointer-events:none;transform-origin:0 0;will-change:transform;box-shadow:0 40px 80px -48px rgba(12,12,12,.45)}
.lk-v__ghost img{width:100%;height:100%;object-fit:cover;display:block}
@media (max-width:639px){
  .lk-v__btn{width:44px;height:44px;min-width:44px;min-height:44px}
  .lk-v__nav{margin-top:-22px}
  .lk-v__prev{left:8px}.lk-v__next{right:8px}
  .lk-v__t{width:24px;border-radius:4px;flex:0 0 auto}
  .lk-v__thumbs{gap:4px;flex-wrap:nowrap;justify-content:flex-start;overflow-x:auto;scrollbar-width:none;padding:2px;width:100%}
  .lk-v__thumbs::-webkit-scrollbar{display:none}
  .lk-v__div{height:22px;margin:0 4px}
}