/* Brand Marquee */
:root {
    --brand-slide-width: 180px;
    /* Increased for Mobile */
    /* Mobile Default */
    --brand-count: 8;
}

@media (min-width: 992px) {
    :root {
        --brand-slide-width: 250px;
        /* Desktop Size */
    }
}

.brand-marquee {
    width: 100%;
    overflow: hidden;
    position: relative;
    background: white;
    padding: 50px 0;
    /* Increased for better presence */
    border-top: 1px solid #eee;
    border-bottom: 1px solid #eee;
}

.brand-track {
    display: flex;
    width: calc(var(--brand-slide-width) * var(--brand-count) * 3);
    /* 3 sets for safety */
    animation: scroll 35s linear infinite;
    /* Slightly slower for readability */
}

.brand-slide {
    width: var(--brand-slide-width);
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0 5px;
}

.brand-logo-text {
    display: block;
    font-size: 2.2rem;
    /* Much larger for text-only version */
    font-weight: 900;
    color: #555;
    text-transform: uppercase;
    font-family: 'Arial Black', Gadget, sans-serif;
    /* Bold branding font */
    letter-spacing: -1px;
    transition: transform 0.3s ease;
}

@media (max-width: 768px) {
    .brand-logo-text {
        font-size: 1.62rem;
        /* Mobile optimization */
    }
}

.brand-slide:hover .brand-logo-text {
    transform: scale(1.1);
}

/* Animations - Looping based on one set of brands */
@keyframes scroll {
    0% {
        transform: translateX(0);
    }

    100% {
        transform: translateX(calc(var(--brand-slide-width) * var(--brand-count) * -1));
    }
}