.miasto{position:relative;z-index:0;width:min(100vw,1520px);margin:clamp(6px,1.4vw,16px) 0 0 50%;translate:-50% 0;aspect-ratio:2048/850;overflow:hidden;pointer-events:none;
  -webkit-mask-image:linear-gradient(to bottom,transparent 0,#000 11%,#000 76%,transparent 100%),linear-gradient(to right,transparent 0,#000 10%,#000 90%,transparent 100%);
  -webkit-mask-composite:source-in;
  mask-image:linear-gradient(to bottom,transparent 0,#000 11%,#000 76%,transparent 100%),linear-gradient(to right,transparent 0,#000 10%,#000 90%,transparent 100%);
  mask-composite:intersect}
.miasto picture,.miasto img{display:block;width:100%;height:100%}
.miasto img{max-width:none;object-fit:cover;object-position:50% 70%}

.integr .sciana{position:relative;z-index:1;margin-top:calc(clamp(56px,8.5vw,128px) * -1)}
.integr .sciana li{background:var(--g-polysk),rgba(10,10,11,.52);-webkit-backdrop-filter:var(--g-blur-maly);backdrop-filter:var(--g-blur-maly)}
@media (hover:hover){.integr .sciana li:hover{background:var(--g-polysk),rgba(10,10,11,.36)}}
.integr .integr-dol{position:relative;z-index:1}
@media (max-width:640px){
  .miasto{width:100vw;aspect-ratio:4/3.05;
    -webkit-mask-image:linear-gradient(to bottom,transparent 0,#000 10%,#000 72%,transparent 100%);-webkit-mask-composite:source-over;
    mask-image:linear-gradient(to bottom,transparent 0,#000 10%,#000 72%,transparent 100%);mask-composite:add}
  .miasto img{object-position:50% 50%}
  .integr .sciana{margin-top:-44px}
}

@keyframes miasto-plyn{from{translate:0 -3%}to{translate:0 3%}}
@media (prefers-reduced-motion:no-preference){
  @supports (animation-timeline:view()){
    html.js:not(.bez-ruchu) .miasto img{scale:1.07;animation:miasto-plyn linear both;animation-timeline:view();animation-range:cover 0% cover 100%}
  }
}
@media (prefers-reduced-transparency:reduce){.integr .sciana li{background:#0E0E11;-webkit-backdrop-filter:none;backdrop-filter:none}}