[data-block-alias="clientQuotesMarquee"].client-quotes {
    height: calc(100% + 1px);
    grid-column: span 12;
    overflow: hidden;
    --quote-gap: clamp(12px, 0.952vw + 8.29px, 20px);
}

[data-block-alias="clientQuotesMarquee"].client-quotes h3 {
    text-align: center;
    text-transform: uppercase;
    margin: 0 0 clamp(2rem, 1.6286rem + 1.5238vw, 3rem);
    grid-column: 2 / -2;
}

/* --- The Marquee Layout --- */

[data-block-alias="clientQuotesMarquee"].client-quotes .quote-marquee-container {
    grid-column: 1 / -1; 
    display: flex;
    flex-direction: column;
    gap: var(--quote-gap);
    margin: 0 0 clamp(2rem, 1.6286rem + 1.5238vw, 3rem);
}

[data-block-alias="clientQuotesMarquee"].client-quotes .quote-marquee {
    overflow: hidden;
    width: 100%;
    display: flex;
}

[data-block-alias="clientQuotesMarquee"].client-quotes .quote-track {
    display: flex;
    width: max-content;
    gap: var(--quote-gap); 
}

[data-block-alias="clientQuotesMarquee"].client-quotes .quote-content {
    display: flex;
    align-items: stretch;
    gap: var(--quote-gap);
    min-width: 100vw; 
}

[data-block-alias="clientQuotesMarquee"].client-quotes .quote-card-wrapper {
    flex: 1 1 0;
    min-width: calc(85vw - var(--quote-gap));
}

/* --- Animations --- */

[data-block-alias="clientQuotesMarquee"].client-quotes .track-left .quote-content {
    animation: scrollQuotesLeft 120s linear infinite;
}

[data-block-alias="clientQuotesMarquee"].client-quotes .track-right .quote-content {
    animation: scrollQuotesRight 120s linear infinite;
}

[data-block-alias="clientQuotesMarquee"].client-quotes .quote-marquee-container:hover .quote-content {
    animation-play-state: paused;
}

@keyframes scrollQuotesLeft {
    0% { transform: translateX(0); }
    100% { transform: translateX(calc(-100% - var(--quote-gap))); }
}

@keyframes scrollQuotesRight {
    0% { transform: translateX(calc(-100% - var(--quote-gap))); }
    100% { transform: translateX(0); }
}

/* --- Scroll Fade-in Animations --- */

[data-block-alias="clientQuotesMarquee"].client-quotes h3,
[data-block-alias="clientQuotesMarquee"].client-quotes .quote-marquee-container,
[data-block-alias="clientQuotesMarquee"].client-quotes a.step-animated-btn {
    opacity: 0;
    transform: translateY(30px);
    transition: opacity 0.8s cubic-bezier(0.16, 1, 0.3, 1), transform 0.8s cubic-bezier(0.16, 1, 0.3, 1);
    will-change: opacity, transform;
}

[data-block-alias="clientQuotesMarquee"].client-quotes h3 {
    transition-delay: 0s;
}

[data-block-alias="clientQuotesMarquee"].client-quotes .quote-marquee-container {
    transition-delay: 0.15s;
}

[data-block-alias="clientQuotesMarquee"].client-quotes a.step-animated-btn {
    transition-delay: 0.3s;
}

[data-block-alias="clientQuotesMarquee"].client-quotes.is-visible h3,
[data-block-alias="clientQuotesMarquee"].client-quotes.is-visible .quote-marquee-container,
[data-block-alias="clientQuotesMarquee"].client-quotes.is-visible a.step-animated-btn {
    opacity: 1;
    transform: translateY(0);
}

/* --- Inner Card Styling --- */

[data-block-alias="clientQuotesMarquee"].client-quotes .quote-card-wrapper .card {
    min-height: clamp(13.25rem, 9.4196rem + 15.7143vw, 23.5625rem);
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

[data-block-alias="clientQuotesMarquee"].client-quotes .quote-card-wrapper .card h3, 
[data-block-alias="clientQuotesMarquee"].client-quotes .quote-card-wrapper .card p {
    word-wrap: break-word;
    overflow-wrap: break-word;
}

[data-block-alias="clientQuotesMarquee"].client-quotes .quote-card-wrapper .card span {
    font-family: 'HelveticNeueBold';
    font-size: clamp(1rem, 0.8143rem + 0.7619vw, 1.5rem);
}

[data-block-alias="clientQuotesMarquee"].client-quotes a.step-animated-btn {
    font-size: clamp(1rem, 0.8143rem + 0.7619vw, 1.5rem);
    padding: clamp(0.4375rem, 0.4143rem + 0.0952vw, 0.5rem) clamp(0.9375rem, 0.9143rem + 0.0952vw, 1rem);
    margin: 0 auto;
    grid-column: 2 / -2;
}

@media (min-width: 768px) {
    [data-block-alias="clientQuotesMarquee"].client-quotes .quote-card-wrapper {
        min-width: calc((100vw - (var(--quote-gap) * 3)) / 2);
    }
}

@media (min-width: 1024px) {
    [data-block-alias="clientQuotesMarquee"].client-quotes .quote-card-wrapper {
        min-width: calc((100vw - (var(--quote-gap) * 4)) / 3);
    }
}