/* Trusted By Logo Section */
.trusted-section {
    position: relative;
    z-index: 5;
    overflow: hidden;
    /* Prevent horizontal scrollbars on body */
}

/* Ensure the track starts from the left and doesn't center itself */
.trusted-section .portfolio-track {
    margin-left: 0 !important;
    margin-right: auto !important;
    padding-left: 2rem !important;
    /* Give it some breathing room on the left */
}


.portfolio-scroller:hover .portfolio-track {
    animation-play-state: paused;
}

.trusted-logo-item {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 100px;
    width: 200px;
    transition: all 0.4s var(--ease-expo-out);
    flex-shrink: 0;
}

.trusted-logo-item:hover {
    transform: scale(1.1);
}

.trusted-logo-img {
    max-width: 95%;
    max-height: 85%;
    object-fit: contain;
    filter: brightness(0) invert(1);
    opacity: 0.8;
    transition: all 0.3s ease;
    user-drag: none;
    -webkit-user-drag: none;
}

/* Specific sizing for densier logos to balance visual weight */
.logo-stc .trusted-logo-img,
.logo-teko .trusted-logo-img,
.logo-yondu .trusted-logo-img {
    max-height: 55%;
}

.logo-oanda .trusted-logo-img {
    max-width: 100%;
    transform: scale(2);
    /* Make it bigger without affecting others */
}

.logo-overstock .trusted-logo-img {
    transform: scale(2);
}

.logo-cloud-employee .trusted-logo-img {
    transform: scale(1.5);
}

.trusted-logo-item:hover .trusted-logo-img {
    opacity: 1;
    filter: brightness(0) invert(1);
}


@media (max-width: 768px) {
    .portfolio-track {
        gap: 2rem;
    }

    .trusted-logo-item {
        height: 60px;
        width: 120px;
        max-width: 140px;
    }

    /* Override styles.css min-height which is too large for these small logos */
    .trusted-section .portfolio-scroller {
        min-height: 120px !important;
    }
}