﻿/* ── Testimonial Scroller ─────────────────────────── */

.testimonial-scroller-wrapper {
    position: relative;
    width: 100%;
    overflow: hidden;
}

.scroller-fade-left,
.scroller-fade-right {
    position: absolute;
    top: 0;
    bottom: 0;
    width: 80px;
    z-index: 2;
    pointer-events: none;
}

.scroller-fade-left {
    left: 0;
    background: linear-gradient(to right, var(--bs-light), transparent);
}

.scroller-fade-right {
    right: 0;
    background: linear-gradient(to left, var(--bs-light), transparent);
}

.testimonial-scroller {
    display: flex;
    gap: 1.25rem;
    width: max-content;
    /* transition for when/if we toggle states */
    transition: transform 0.5s ease;
}

    /* Only animate if this class is present */
    .testimonial-scroller.is-scrolling {
        animation: scroll-left 35s linear infinite;
    }

    /* If not scrolling, center the content on the screen */
    .testimonial-scroller.is-static {
        width: 100%;
        justify-content: center;
    }

    .testimonial-scroller:hover {
        animation-play-state: paused;
    }

@keyframes scroll-left {
    0% {
        transform: translateX(0);
    }

    100% {
        transform: translateX(-50%);
    }
}

.testimonial-card {
    width: 450px;
    flex-shrink: 0;
}

    .testimonial-card .card {
        border: 1px solid rgba(0, 0, 0, 0.08) !important;
        border-radius: 0.75rem;
        box-shadow: 0 2px 8px rgba(0, 0, 0, 0.05);
        transition: box-shadow 0.2s ease;
    }

        .testimonial-card .card:hover {
            box-shadow: 0 4px 16px rgba(0, 0, 0, 0.1);
        }

.tracking-widest {
    letter-spacing: 0.12em;
}
