/* Scoped additions for local service pages; shared design is in /styles.css. */
.city-page .city-services .service-card { display: flex; flex-direction: column; }
.city-page :is(.city-services, .city-problems) .service-icon { width: 48px; height: 48px; flex-shrink: 0; }
.city-page .city-services .hero-actions { margin-top: auto; padding-top: 24px; }
.city-page .city-services .knowledge-grid, .city-page .city-buildings { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px; }
.city-page .city-buildings .article-cover { margin-top: 20px; }
.city-page .city-map iframe { display: block; width: 100%; height: clamp(280px, 38vw, 450px); border: 0; }
.city-page :is(a, button, input, textarea):focus-visible { outline: 2px solid var(--red); outline-offset: 4px; }
@media (max-width: 680px) { .city-page .city-services .knowledge-grid, .city-page .city-buildings { grid-template-columns: 1fr; } }