.hero-image { overflow: hidden; background: #13221f; position: relative; isolation: auto; }
.hero-image::after { display: none; }
.city-gallery { position: absolute; inset: 0; display: flex; }
.city-gallery a { flex: 1; min-width: 0; position: relative; overflow: hidden; border-right: 1px solid rgba(255,255,255,.36); transition: flex .55s cubic-bezier(.2,.75,.25,1); }
.city-gallery a:last-child { border-right: 0; }
.city-gallery a::after { content: ''; position: absolute; inset: 0; background: linear-gradient(180deg,rgba(19,34,31,.05) 35%,rgba(19,34,31,.76)); transition: background .35s ease; }
.city-gallery img { width: 100%; height: 100%; display: block; object-fit: cover; filter: saturate(.8) contrast(1.06); transform: scale(1.03); transition: transform .7s cubic-bezier(.2,.75,.25,1),filter .35s ease; }
.city-gallery span { position: absolute; z-index: 1; left: 13px; bottom: 34px; color: #fff; font-size: 10px; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; writing-mode: vertical-rl; transform: rotate(180deg); white-space: nowrap; }
.city-gallery b { display: inline-block; margin-top: 10px; color: #f4a34d; font-size: 16px; transition: transform .35s ease; }
@media (hover:hover) and (min-width:761px) { .city-gallery:hover a { flex: .72; } .city-gallery a:hover,.city-gallery a:focus-visible { flex: 2.35; } .city-gallery a:hover img,.city-gallery a:focus-visible img { filter: saturate(1) contrast(1.08); transform: scale(1.1); } .city-gallery a:hover::after,.city-gallery a:focus-visible::after { background: linear-gradient(180deg,rgba(19,34,31,0) 30%,rgba(19,34,31,.67)); } .city-gallery a:hover b,.city-gallery a:focus-visible b { transform: translateY(-5px); } }
.city-gallery a:focus-visible { outline: 3px solid #f4a34d; outline-offset: -3px; z-index: 2; }
@media (max-width:760px) { .city-gallery span { left: 8px; bottom: 26px; font-size: 8px; } .city-gallery b { margin-top: 7px; font-size: 12px; } }
@media (prefers-reduced-motion: reduce) { .city-gallery a, .city-gallery img, .city-gallery a::after, .city-gallery b { transition: none; } }