.cities-container{width:100%;padding:20px 0;margin:30px 0}.cities-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;max-width:1400px;margin:0 auto;padding:0 15px}.city-button{display:flex;align-items:center;justify-content:space-between;padding:16px 22px;background:#fff;border:2px solid #e0e0e0;border-radius:8px;color:#282828;text-decoration:none;font-size:16px;font-weight:500;transition:all .3s ease;box-shadow:0 2px 8px rgba(0,0,0,.06);position:relative}.city-button:hover{transform:translateY(-2px);box-shadow:0 4px 16px rgba(0,0,0,.12);border-color:#5f8bce;background:#f8f9fa}.city-button:active{transform:translateY(0);box-shadow:0 2px 8px rgba(0,0,0,.08)}.city-name{flex:1;color:#282828}.city-arrow{font-size:20px;margin-left:12px;transition:transform .3s ease;color:#5f8bce}.city-button:hover .city-arrow{transform:translateX(4px)}.city-button:nth-child(4n+1):hover{border-color:#5f8bce}.city-button:nth-child(4n+1):hover .city-arrow{color:#5f8bce}.city-button:hover{border-color:#56c3d7!important}.city-button:hover .city-arrow{color:#56c3d7!important}.city-button:nth-child(4n+3):hover{border-color:#86c655}.city-button:nth-child(4n+3):hover .city-arrow{color:#86c655}.city-button:nth-child(4n+4):hover{border-color:#f35b53}.city-button:nth-child(4n+4):hover .city-arrow{color:#f35b53}.cities-empty{text-align:center;padding:40px 20px;color:#666;font-size:16px;background:#fff3cd;border:2px solid #ffc107;border-radius:8px;margin:20px 0}@media (max-width:1024px){.cities-grid{grid-template-columns:repeat(3,1fr);gap:15px}}@media (max-width:768px){.cities-grid{grid-template-columns:repeat(2,1fr);gap:15px}.city-button{padding:16px 20px;font-size:15px}.city-arrow{font-size:20px}}@media (max-width:480px){.cities-grid{grid-template-columns:1fr;gap:12px}.city-button{padding:15px 18px;font-size:14px;border-radius:10px}.cities-container{margin:20px 0;padding:10px 0}}