/*==========================================================
  NX TESTIMONIALS
==========================================================*/

.nx-testimonials{

    position:relative;

    width:100%;

    overflow:hidden;

    padding-top:3rem;

    padding-bottom:5rem;

}

.nx-testimonials-viewport{

    width:100%;

    overflow:hidden;

}

.nx-testimonials-viewport + .nx-testimonials-viewport{

    margin-top:21px;

}

/*==========================================================
  TRACK
==========================================================*/

.nx-testimonials-track{

    display:flex;

    flex-wrap:nowrap;

    align-items:stretch;

    gap:24px;

    width:max-content;

    will-change:transform;

    transform:translateZ(0);

    backface-visibility:hidden;

}

/*==========================================================
  CARD
==========================================================*/

.nx-testimonial-card{

    flex:0 0 360px;

    min-height:220px;

    display:flex;

    flex-direction:column;

    justify-content:space-between;

    padding:1.75rem;

    background:var(--nx-surface);

    border:1px solid var(--nx-border);

    border-radius:20px;

    transition:
        border-color .25s ease,
        box-shadow .25s ease;

}

.nx-testimonial-card:hover{

    border-color:rgba(255,149,0,.55);

    box-shadow:
        0 6px 18px rgba(0,0,0,.16);

}
/*==========================================================
  CONTENT
==========================================================*/

.nx-testimonial-rating{

    color:var(--nx-primary);

    font-size:1rem;

    letter-spacing:2px;

    margin-bottom:1rem;

}

.nx-testimonial-text{

    flex:1;

    margin:0 0 1.5rem;

    line-height:1.7;

}

.nx-testimonial-author{

    display:flex;

    flex-direction:column;

    gap:.25rem;

}

.nx-testimonial-author strong{

    font-weight:600;

}

.nx-testimonial-author span{

    color:var(--nx-text-muted);

    font-size:.9rem;

}

/*==========================================================
  ANIMATION
==========================================================*/

@keyframes nx-scroll-left{

    from{

        transform:translate3d(0,0,0);

    }

    to{

        transform:translate3d(calc(-1 * var(--nx-track-width)),0,0);

    }

}

@keyframes nx-scroll-right{

    from{

        transform:translate3d(calc(-1 * var(--nx-track-width)),0,0);

    }

    to{

        transform:translate3d(0,0,0);

    }

}

.nx-testimonials-track[data-direction="left"]{

    animation:
        nx-scroll-left var(--nx-speed) linear infinite;

}

.nx-testimonials-track[data-direction="right"]{

    animation:
        nx-scroll-right var(--nx-speed) linear infinite;

}

/*==========================================================
  INTERACTION
==========================================================*/

@media (hover:hover){

    .nx-testimonials-track:hover{

        animation-play-state:paused;

    }

}

@media (prefers-reduced-motion:reduce){

    .nx-testimonials-track{

        animation:none;

        transform:none;

    }

}

/*==========================================================
  MOBILE
==========================================================*/

@media (max-width:768px){

    .nx-testimonials{

        padding:3rem 0;

    }

    .nx-testimonials-track{

        gap:16px;

    }

    .nx-testimonial-card{

        flex:0 0 280px;

        min-height:190px;

        padding:1.5rem;

    }

}