/* Homepage reference marquee — kept out of main.min.css so it always loads */
.m34-refs {
    --m34-gap: 28px;
    --m34-row-height: 104px;
    --m34-radius: 14px;
    --m34-speed-top: 140s;
    --m34-speed-bottom: 140s;
    width: 100%;
    max-width: 100%;
    padding: 32px 0;
    overflow: hidden;
    isolation: isolate;
}

.m34-refs__row {
    overflow: hidden;
    width: 100%;
    padding: 10px 0;
    cursor: grab;
    touch-action: pan-y;
    -webkit-mask-image: linear-gradient(to right, transparent, #000 10%, #000 90%, transparent);
    mask-image: linear-gradient(to right, transparent, #000 10%, #000 90%, transparent);
}

.m34-refs__row.is-dragging {
    cursor: grabbing;
}

.m34-refs__track {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    align-items: center;
    gap: var(--m34-gap);
    width: max-content;
    will-change: transform;
}

.m34-refs__item {
    flex: 0 0 auto;
    box-sizing: border-box;
    width: 220px;
    min-width: 220px;
    height: var(--m34-row-height);
    padding: 18px 22px;
    border-radius: var(--m34-radius);
    background: #fff;
    box-shadow: 0 10px 30px rgba(0, 0, 0, .06);
    display: flex;
    align-items: center;
    justify-content: center;
}

.m34-refs__item img {
    max-height: 56px;
    max-width: 160px;
    width: auto;
    height: auto;
    object-fit: contain;
    -webkit-user-drag: none;
    user-select: none;
    pointer-events: none;
}

@media (max-width: 767.98px) {
    .m34-refs {
        --m34-gap: 16px;
        --m34-row-height: 84px;
        padding: 8px 0 12px;
    }

    .m34-refs__row {
        padding: 4px 0;
    }

    .m34-refs__item {
        width: 176px;
        min-width: 176px;
        padding: 12px 14px;
    }
}