.city-page{min-height:100vh;background:#f8fafc;padding-bottom:5rem}.city-hero{background:linear-gradient(135deg,#4f46e5,#7c3aed 60%,#6d28d9);padding:3.5rem 1.5rem 4rem;text-align:center}.city-hero-inner{max-width:600px;margin:0 auto}.city-hero-title{font-size:2rem;font-weight:800;color:#fff;margin-bottom:.4rem;letter-spacing:-.5px}.city-hero-sub{color:hsla(0,0%,100%,.75);font-size:1rem;margin-bottom:1.75rem}.city-search-wrapper{position:relative;width:100%}.city-search-box{display:flex;align-items:center;gap:.6rem;background:#fff;border-radius:14px;padding:.75rem 1.1rem;box-shadow:0 8px 32px rgba(0,0,0,.18)}.city-search-icon{flex-shrink:0}.city-search-input{flex:1 1;border:none;outline:none;font-size:.95rem;color:#111827;background:transparent;font-family:inherit}.city-search-input::placeholder{color:#9ca3af}.city-search-clear{background:none;border:none;color:#9ca3af;cursor:pointer;font-size:.85rem;padding:0 .2rem}.city-search-clear:hover{color:#6d28d9}.city-suggestions-dropdown{position:absolute;top:calc(100% + 6px);left:0;right:0;width:100%;background:#fff;border-radius:14px;box-shadow:0 16px 48px rgba(0,0,0,.22);overflow:hidden;z-index:200;border:1.5px solid #e8e8f0;display:flex;flex-direction:column}.city-suggestion-item{display:flex;align-items:center;gap:.85rem;width:100%;padding:.85rem 1.15rem;background:none;border:none;border-bottom:1px solid #f1f5f9;cursor:pointer;text-align:left;transition:background .12s;box-sizing:border-box;min-width:0}.city-suggestion-item:last-child{border-bottom:none}.city-suggestion-item:hover{background:#f5f3ff}.city-suggestion-text{display:flex;flex-direction:column;gap:.1rem;min-width:0;overflow:hidden}.city-suggestion-name{font-size:.92rem;font-weight:600;color:#111827}.city-suggestion-name,.city-suggestion-state{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.city-suggestion-state{font-size:.76rem;color:#6b7280}.city-suggestion-empty{padding:1rem 1.15rem;font-size:.88rem;color:#6b7280;text-align:left}.city-use-location-btn{display:flex;align-items:center;gap:.6rem;background:none;border:none;cursor:pointer;color:#6366f1;font-size:.9rem;font-weight:600;padding:.6rem 0;margin:.5rem 0 0;font-family:inherit;transition:color .15s}.city-use-location-btn:hover{color:#4338ca}.city-use-location-btn svg{flex-shrink:0}.city-content{max-width:1100px;margin:0 auto;padding:2.5rem 1.5rem 0}.city-section{margin-bottom:3rem}.city-section-title{font-size:1.1rem;font-weight:700;color:#111827;margin-bottom:1.25rem}.popular-cities-grid{display:grid;grid-template-columns:repeat(6,1fr);grid-gap:1rem;gap:1rem}@media (max-width:1024px){.popular-cities-grid{grid-template-columns:repeat(4,1fr)}}@media (max-width:640px){.popular-cities-grid{grid-template-columns:repeat(3,1fr)}}@media (max-width:400px){.popular-cities-grid{grid-template-columns:repeat(2,1fr)}}.popular-city-card{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.6rem;padding:1.1rem .75rem .9rem;border-radius:14px;border:1.5px solid #e8e8f0;background:#f4f4fb;text-decoration:none;transition:transform .18s,box-shadow .18s,border-color .18s,background .18s;cursor:pointer}.popular-city-card:hover{transform:translateY(-3px);box-shadow:0 8px 24px rgba(99,102,241,.15);border-color:#a5b4fc;background:#eef2ff}.popular-city-icon{display:flex;align-items:center;justify-content:center;width:64px;height:64px;color:#6366f1}.popular-city-label{display:flex;flex-direction:column;align-items:center;gap:.15rem;text-align:center}.popular-city-name{font-size:.82rem;font-weight:700;color:#1e1b4b;line-height:1.2}.popular-city-state{font-size:.66rem;color:#6b7280}.city-all-header{margin-bottom:1rem}.alphabet-bar{display:flex;flex-wrap:wrap;gap:.25rem;margin-top:.75rem}.alpha-btn{width:30px;height:30px;border-radius:6px;border:1.5px solid #e5e7eb;background:#fff;font-size:.78rem;font-weight:600;color:#374151;cursor:pointer;transition:all .15s;display:flex;align-items:center;justify-content:center}.alpha-btn:hover:not(.disabled){background:#ede9fe;border-color:#7c3aed;color:#6d28d9}.alpha-btn.active{background:#6d28d9;border-color:#6d28d9;color:#fff}.alpha-btn.disabled{opacity:.3;cursor:default}.all-cities-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));grid-gap:.6rem;gap:.6rem}.city-chip{display:flex;align-items:center;gap:.45rem;padding:.55rem .9rem;background:#fff;border:1.5px solid #e5e7eb;border-radius:10px;text-decoration:none;font-size:.84rem;font-weight:500;color:#374151;transition:all .15s}.city-chip:hover{border-color:#7c3aed;color:#6d28d9;background:#f5f3ff}.city-no-results{text-align:center;padding:3rem 0;color:#6b7280;font-size:.95rem}