// marcas css
       .brands-container {
            max-width: 99%;
            overflow: hidden;
            padding-top: 10%;
            background: none;
            
        }
        
        .brands-scroll {
            display: flex;
            animation: scrollBrands 30s linear infinite;
            gap: 10px;
            padding: 0 10px;
            margin bottom: 500px;
        }
        
        .brands-scroll:hover {
            animation-play-state: paused;
        }
        
        .brand-item {
            flex-shrink: 0;
            width: 80px;
            height: 40px;
            display: flex;
            align-items: center;
            justify-content: center;
            background: rgb(147, 165, 189);
            border-radius: 8px;
            padding: 10px;
            box-shadow: 0 2px 4px rgba(0,0,0,0.1);
        }
        
        .brand-item img {
            max-width: 100%;
            max-height: 100%;
            filter: grayscale(100%);
            opacity: 1;
            transition: all 0.3s ease;
        }
        
        .brand-item:hover img {
            filter: grayscale(0%);
            opacity: 1;
            transform: scale(1.1);
        }
        
        @keyframes scrollBrands {
            0% { transform: translateX(0); }
            100% { transform: translateX(calc(-100px * 21 - 20px * 21)); }
        }
        
        /* Fallback caso JavaScript esteja desativado */
        .no-js .brands-scroll {
            animation: none;
            flex-wrap: wrap;
            justify-content: center;
}