.city-popup-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background-color:rgba(0,0,0,.5);display:flex;align-items:center;justify-content:center;z-index:9999;padding:16px}.city-popup-modal{background:#fff;border-radius:16px;box-shadow:0 20px 25px -5px rgba(0,0,0,.1),0 10px 10px -5px rgba(0,0,0,.04);max-width:640px;width:100%;max-height:90vh;overflow-y:auto;animation:modalSlideIn .3s ease-out}@keyframes modalSlideIn{0%{opacity:0;transform:scale(.9) translateY(-20px)}to{opacity:1;transform:scale(1) translateY(0)}}.city-popup-header{position:relative;padding:24px 24px 15px;border-bottom:1px solid #f3f4f6}.city-popup-title{font-size:24px;font-weight:700;color:#1f2937;text-align:center;margin:0;font-family:inherit}.city-popup-close{position:absolute;right:24px;top:24px;padding:8px;background:none;border:none;border-radius:50%;cursor:pointer;transition:background-color .2s ease;display:flex;align-items:center;justify-content:center}.city-popup-close:hover{background-color:#f3f4f6}.city-popup-close svg{width:24px;height:24px;color:#6b7280}.city-popup-content{padding:16px 24px 8px;text-align:center}.experience-text{color:#374151;font-weight:500;margin:0 0 8px;font-size:16px}.cities-list{color:#6b7280;font-weight:600;margin:0 0 16px;line-height:1.5;font-size:14px}.description-text{color:#6b7280;font-size:18px;margin:0;font-weight:400}.city-grid{padding:0 24px 32px}.cities-container{display:grid;grid-template-columns:repeat(3,1fr);grid-gap:16px;gap:16px}@media (min-width:768px){.cities-container{grid-template-columns:repeat(4,1fr)}}@media (max-width:480px){.city-popup-overlay{padding:8px}.city-popup-header{padding:16px}.city-popup-title{font-size:20px}.city-grid{padding:0 16px 24px}.cities-container{gap:12px}}.city-card{padding:16px;border-radius:12px;border:2px solid #e5e7eb;background:#fff;cursor:pointer;transition:all .2s ease;display:flex;flex-direction:column;align-items:center;justify-content:center}.city-card:hover{box-shadow:0 10px 15px -3px rgba(0,0,0,.1),0 4px 6px -2px rgba(0,0,0,.05);transform:translateY(-2px) scale(1.02);border-color:#fca5a5}.city-card:active{transform:translateY(0) scale(.98)}.city-icon{display:flex;align-items:center;justify-content:center;transition:all .2s ease;width:68px;height:68px}.city-icon img,.city-icon svg{max-width:100%;max-height:100%;object-fit:contain}.city-image{width:100%;height:100%;object-fit:contain;transition:all .2s ease}.city-name{font-weight:500;font-size:14px;color:#374151;margin:0;text-align:center;line-height:1.2}.city-card:hover .city-name{color:#dc2626}@media (max-width:768px){.city-icon{width:50px;height:50px}.city-icon img,.city-icon svg{width:40px!important;height:40px!important;max-width:40px;max-height:40px}.city-name{font-size:12px}}@media (max-width:576px){.city-card{padding:16px 12px;min-height:90px}.city-icon{width:40px;height:40px}.city-icon img,.city-icon svg{width:30px!important;height:30px!important;max-width:30px;max-height:30px;object-fit:contain}.city-name{font-size:10px}}@media (max-width:480px){.city-card{padding:12px 8px;min-height:80px}.city-icon{width:35px;height:35px}.city-icon img,.city-icon svg{width:25px!important;height:25px!important;max-width:25px;max-height:25px}.city-name{font-size:9px;margin-top:4px}}.city-card:focus,.city-popup-close:focus{outline:2px solid #3b82f6;outline-offset:2px}.city-card.loading{opacity:.6;pointer-events:none}.city-card.loading .city-icon{animation:pulse 2s cubic-bezier(.4,0,.6,1) infinite}@keyframes pulse{0%,to{opacity:1}50%{opacity:.5}}.search-section{padding:24px 24px 16px;border-top:1px solid #f3f4f6;text-align:center}.search-header{display:flex;align-items:center;justify-content:center;gap:8px;margin-bottom:16px}.search-header h3{margin:0;font-size:16px;font-weight:600;color:#374151}.search-icon{color:#6b7280}.search-toggle-btn{display:flex;align-items:center;justify-content:center;gap:8px;padding:12px 24px;background:#303943;color:#fff;border:none;border-radius:8px;font-weight:500;cursor:pointer;transition:all .2s ease;margin:0 auto}.search-toggle-btn:hover{background:#000;transform:translateY(-1px);box-shadow:0 4px 12px rgba(0,0,0,.3)}.search-input-section{padding:0 24px 16px}.search-form{width:100%}.search-input-container{position:relative;display:flex;align-items:center}.search-input{width:100%;padding:12px 16px 12px 48px;border:2px solid #e5e7eb;border-radius:8px;font-size:16px;transition:border-color .2s ease;outline:none}.search-input:focus{border-color:#303943;box-shadow:0 0 0 3px rgba(48,57,67,.1)}.search-input-icon{position:absolute;left:16px;color:#6b7280;z-index:1}.search-clear{position:absolute;right:12px;padding:4px;background:none;border:none;border-radius:50%;cursor:pointer;color:#6b7280;transition:background-color .2s ease}.search-clear:hover{background-color:#f3f4f6}.search-results{max-height:300px;overflow-y:auto;padding:0 24px}.search-results-list{display:flex;flex-direction:column;gap:4px}.search-result-item{display:flex;align-items:center;gap:12px;padding:12px 16px;border:none;border-radius:8px;background:#fff;cursor:pointer;transition:all .2s ease;text-align:left;width:100%}.search-result-item:hover{background-color:#f8fafc;transform:translateX(4px);box-shadow:0 2px 8px rgba(0,0,0,.1)}.result-icon{color:#303943;flex-shrink:0}.result-info{display:flex;flex-direction:column;gap:2px}.result-city{font-weight:600;color:#1f2937;font-size:14px}.result-state{font-size:12px;color:#6b7280}.no-results{text-align:center;padding:32px 16px;color:#6b7280}.no-results-icon{margin:0 auto 16px;color:#d1d5db}.no-results p{margin:0 0 8px;font-weight:500}.no-results-subtitle{font-size:14px;color:#9ca3af}.back-section{padding:16px 24px 24px;border-top:1px solid #f3f4f6}.back-btn{display:flex;align-items:center;gap:8px;padding:10px 16px;background:#f8fafc;border:1px solid #e5e7eb;border-radius:6px;color:#374151;cursor:pointer;transition:all .2s ease;font-weight:500;margin:0 auto}.back-btn:hover{background:#f1f5f9;border-color:#cbd5e1}@media (max-width:576px){.search-section{padding:16px 16px 12px}.search-header h3{font-size:14px}.search-toggle-btn{padding:10px 20px;font-size:14px}.search-input-section{padding:0 16px 12px}.search-input{padding:10px 12px 10px 40px;font-size:14px}.search-input-icon{left:12px}.search-results{padding:0 16px;max-height:250px}.search-result-item{padding:10px 12px}.result-city{font-size:13px}.result-state{font-size:11px}.back-section{padding:12px 16px 16px}.back-btn{padding:8px 12px;font-size:14px}}.search-toggle-btn{position:relative;overflow:hidden}.search-toggle-btn:before{content:"";position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,hsla(0,0%,100%,.1),transparent);transition:left .5s}.search-toggle-btn:hover:before{left:100%}