.city-preview { margin: clamp(28px, 6vh, 56px) auto 0; font-family: "Golos Text", Arial, sans-serif; --muted: #6e695e; }
.city-preview .section-head { margin-bottom: 26px; }.city-preview #cities-title { margin: 0; font-size: clamp(27px, 3.2vw, 38px); font-weight: 500; line-height: 1.18; letter-spacing: -.035em; }.city-preview .cities { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 20px; }.city-preview .city { min-width: 0; }.city-preview .city-link { display: block; color: inherit; text-decoration: none; border-radius: 16.8px; }.city-preview .photo { overflow: hidden; border-radius: 16.8px; aspect-ratio: 3 / 2; background: #f2f0eb; }.city-preview .photo img { display: block; width: 100%; height: 100%; object-fit: cover; transition: transform 220ms ease-out; }.city-preview .photo-antalya { object-position: 50% 55%; }.city-preview .photo-alanya { object-position: 50% 50%; }.city-preview .photo-istanbul { object-position: 50% 50%; }.city-preview .city-copy { padding: 13px 2px 0; }.city-preview .city-title { display: flex; align-items: center; justify-content: space-between; gap: 10px; }.city-preview h3 { margin: 0; font-size: 20px; line-height: 1.25; font-weight: 500; letter-spacing: -.025em; }.city-preview .city-arrow { width: 20px; height: 20px; color: #d9771b; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; flex: none; transition: transform 180ms ease-out; }.city-preview .city-country { margin: 5px 0 0; color: var(--muted); font-size: 13px; line-height: 1.4; }.city-preview .city-count { margin: 9px 0 0; font-size: 13px; line-height: 1.4; }.city-preview .city-count strong { font-weight: 500; }.city-preview .city-link:focus-visible { outline: 2px solid var(--ink); outline-offset: 6px; }
    @media (hover: hover) and (pointer: fine) {.city-preview .city-link:hover img { transform: scale(1.025); }.city-preview .city-link:hover .city-arrow { transform: translateX(3px); } }.city-preview .credits { margin-top: 46px; color: var(--muted); font-size: 12px; line-height: 1.6; }.city-preview .credits summary { cursor: pointer; width: fit-content; }.city-preview .credits p { margin: 8px 0 0; }.city-preview .credits a { color: inherit; text-underline-offset: 3px; }
    @media (max-width: 900px) {.city-preview .cities { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    }
    @media (max-width: 760px) {.city-preview .cities { gap: 20px; }.city-preview h3 { font-size: 20px; }.city-preview .city-country, .city-preview .city-count { font-size: 13px; }
    }
    @media (max-width: 600px) {.city-preview .section-head { margin-bottom: 21px; }.city-preview .cities { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 23px 16px; }.city-preview .photo { aspect-ratio: 3 / 2; border-radius: 14.7px; }.city-preview .city-copy { padding: 10px 0 0; }.city-preview h3 { font-size: 17px; }.city-preview .city-arrow { width: 16px; height: 16px; }.city-preview .city-country, .city-preview .city-count { font-size: 12px; }.city-preview .city-country { margin-top: 4px; }.city-preview .city-count { margin-top: 6px; }.city-preview .credits { margin-top: 32px; }
    }
    @media (prefers-reduced-motion: reduce) {.city-preview .photo img, .city-preview .city-arrow { transition: none; } }