.city-directory{margin:clamp(28px,5vw,72px) auto;padding:clamp(22px,4vw,48px);max-width:1240px;border:1px solid #cddbd9;border-radius:28px;background:linear-gradient(145deg,#f8fbfa,#e7f0ee)}
.city-directory-heading{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(260px,.8fr);gap:24px;align-items:end}.city-directory-heading h2{margin:.45rem 0 0;font-size:clamp(2rem,4vw,3.6rem);line-height:1}.city-directory-intro{display:grid;justify-items:start;gap:16px}.city-directory-intro p{margin:0;color:#425b59;line-height:1.65}
.city-directory-controls{display:grid;grid-template-columns:2fr 1fr;gap:14px;margin:28px 0 12px}.city-directory-controls label{display:grid;gap:7px;font-weight:800;color:#173d3a}.city-directory-controls input,.city-directory-controls select{width:100%;min-height:50px;padding:0 14px;border:1px solid #9db7b3;border-radius:12px;background:#fff;color:#173d3a;font:inherit}
.city-directory-status{margin:0 0 14px;color:#526b68}.city-directory-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}.city-directory-card{display:flex;min-width:0;min-height:190px;flex-direction:column;padding:20px;border:1px solid #c8d9d6;border-radius:18px;background:#fff;color:#173d3a;text-decoration:none;box-shadow:0 12px 30px rgba(22,61,58,.06);transition:transform .18s ease,border-color .18s ease}.city-directory-card:hover,.city-directory-card:focus-visible{transform:translateY(-3px);border-color:#e2634b}.city-directory-card span{font-size:.75rem;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:#647d79}.city-directory-card strong{margin:.5rem 0;font-family:Merriweather,serif;font-size:1.25rem}.city-directory-card small{line-height:1.5;color:#526b68}.city-directory-card b{margin-top:auto;padding-top:16px;color:#bd4734}
.city-directory-card[hidden]{display:none}
@media(max-width:800px){.city-directory-heading,.city-directory-controls{grid-template-columns:1fr}.city-directory-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:520px){.city-directory{padding:20px 14px;border-radius:20px}.city-directory-grid{grid-template-columns:1fr}.city-directory-card{min-height:0}}