/* Блок главной «Популярные работы»: квадратные карточки по витку спирали (3D), крутится мышью, пальцем, стрелками.
   Без JS — обычный ряд с горизонтальной прокруткой. */
.vg-pop{padding-block:clamp(56px,9vw,120px) clamp(16px,3vw,40px);border-top:1px solid #ececec}
.vg-pop-head{display:flex;align-items:flex-end;justify-content:space-between;gap:16px;margin-bottom:clamp(8px,2vw,20px)}
.vg-pop-head>div{display:flex;flex-direction:column;gap:14px;min-width:0}
.vg-pop-eyebrow{font-family:var(--font-meta);font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:#d30805}
.vg-pop h2{font-family:var(--font-ui);font-weight:500;font-size:clamp(30px,3.4vw,48px);line-height:1.08;letter-spacing:-.02em;margin:0;text-wrap:balance}
.vg-pop-all{flex:none;color:#111;font-size:15px;text-decoration:none;border-bottom:1px solid #bbb;padding-bottom:2px;transition:border-color .2s,color .2s}
.vg-pop-all:hover{color:#d30805;border-color:#d30805}
.vg-pop-all:focus-visible{outline:2px solid #666;outline-offset:3px}
/* без JS: ряд с прокруткой */
.vg-pop-stage{--s:clamp(240px,20vw,340px);display:flex;gap:16px;overflow-x:auto;scroll-snap-type:x mandatory;padding:8px 0 16px}
.vg-pop-card{flex:0 0 var(--s);width:var(--s);height:var(--s);scroll-snap-align:start;border-radius:14px;overflow:hidden;background:#f2f2f2;display:block}
.vg-pop-card img{display:block;width:100%;height:100%;object-fit:cover;pointer-events:none;-webkit-user-drag:none}
.vg-pop-card:focus-visible{outline:2px solid #666;outline-offset:3px}
/* с JS: спираль */
.vg-pop.is-3d .vg-pop-stage{position:relative;display:block;overflow:hidden;scroll-snap-type:none;height:calc(var(--s) * 1.42);padding:0;perspective:1400px;cursor:grab;touch-action:pan-y;user-select:none;-webkit-user-select:none}
.vg-pop.is-3d .vg-pop-stage.is-drag{cursor:grabbing}
.vg-pop.is-3d .vg-pop-card{position:absolute;left:50%;top:46%;margin:calc(var(--s) / -2) 0 0 calc(var(--s) / -2);will-change:transform,opacity}
.vg-pop-head>.vg-pop-side{flex-direction:row}
.vg-pop-side{display:flex;align-items:center;gap:24px;flex-wrap:nowrap}
.vg-pop-nav{display:none;align-items:center;gap:10px}
.vg-pop.is-3d .vg-pop-nav{display:flex}
.vg-pop-nav button{display:grid;place-items:center;width:44px;height:44px;padding:0;border:1px solid #e3e3e3;border-radius:50%;background:#fff;color:#111;cursor:pointer;transition:border-color .2s}
.vg-pop-nav button:hover{border-color:#111}
.vg-pop-nav button:focus-visible{outline:2px solid #666;outline-offset:2px}
.vg-pop-nav button svg{width:18px;height:18px}
.vg-pop-count{min-width:56px;text-align:center;font:500 13px/1 var(--font-meta);color:#666;font-variant-numeric:tabular-nums}
@media(max-width:759px){
  .vg-pop{padding-block:56px}
  .vg-pop h2{font-size:26px}
  .vg-pop-stage{--s:180px}
  .vg-pop-head{flex-direction:column;align-items:flex-start}
  .vg-pop-head>.vg-pop-side{width:100%;justify-content:space-between}
}
