.hero-bg {
            background-image: url('https://images.unsplash.com/photo-1578662996442-48f60103fc96?ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D&auto=format&fit=crop&w=2070&q=80');
            background-size: cover;
            background-position: center;
        }
        
        .route-option:hover {
            transform: translateY(-5px);
            box-shadow: 0 10px 25px -5px rgba(0, 0, 0, 0.1);
        }
        
        .city-card:hover {
            transform: scale(1.03);
        }
        
        .transportation-card:hover {
            transform: scale(1.02);
            box-shadow: 0 8px 25px -5px rgba(0, 0, 0, 0.1);
        }
        
        @keyframes pulse {
            0%, 100% {
                opacity: 1;
            }
            50% {
                opacity: 0.5;
            }
        }
        
        .animate-pulse {
            animation: pulse 2s cubic-bezier(0.4, 0, 0.6, 1) infinite;
        }
        
        #map {
            min-height: 400px;
        }
        
        .map-placeholder {
            background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
        }