/*==================================================
TESTIMONIALS PREVIEW
==================================================*/

.testimonials-preview{

    position:relative;

    padding:110px 0;

    background:#fcfbff;

    overflow:hidden;

}

.testimonials-preview .container{

    max-width:1280px;

    margin:0 auto;

    padding:0 20px;

}

/*==================================================
SECTION HEADER
==================================================*/

.testimonials-preview .section-heading{

    max-width:760px;

    margin:0 auto 60px;

    text-align:center;

}

.testimonials-preview .section-tag{

    display:inline-block;

    padding:8px 22px;

    border-radius:40px;

    background:#f3efff;

    color:#6d28d9;

    font-size:.95rem;

    font-weight:700;

    margin-bottom:22px;

}

.testimonials-preview h2{

    font-size:2.7rem;

    line-height:1.2;

    color:#241c44;

    margin-bottom:20px;

}

.testimonials-preview .section-heading p{

    color:#666;

    font-size:1.05rem;

    line-height:1.9;

}

/*==================================================
HORIZONTAL SLIDER
==================================================*/

.testimonials-slider{

    display:flex;

    gap:24px;

    overflow-x:auto;

    padding:16px 6px 12px;

    scroll-snap-type:x mandatory;

    scroll-padding-left:6px;

    scroll-behavior:smooth;

    -webkit-overflow-scrolling:touch;

    cursor:grab;

    scrollbar-width:none;

}

.testimonials-slider::-webkit-scrollbar{

    display:none;

}

.testimonials-slider.dragging{

    cursor:grabbing;

    user-select:none;

}

/*==================================================
TESTIMONIAL CARD
==================================================*/

.testimonial-card{

    position:relative;

    overflow:hidden;

    flex:0 0 360px;

    min-height:330px;

    display:flex;

    flex-direction:column;

    justify-content:space-between;

    scroll-snap-align:start;

    padding:34px;

    border-radius:28px;

    border:1px solid rgba(109,40,217,.08);

    border-top:4px solid #6d28d9;

    background:linear-gradient(
        180deg,
        #ffffff 0%,
        #fcfaff 100%
    );

    box-shadow:0 12px 35px rgba(0,0,0,.05);

    transition:
        transform .35s ease,
        box-shadow .35s ease,
        border-color .35s ease,
        background .35s ease;

}

.testimonial-card:hover{

    transform:translateY(-8px) scale(1.015);

    box-shadow:0 30px 65px rgba(79,70,229,.12);

}

/*==================================================
PREMIUM GLOW
==================================================*/

.testimonial-card::before{

    content:"";

    position:absolute;

    top:-120px;

    right:-120px;

    width:240px;

    height:240px;

    border-radius:50%;

    background:#f6d77b;

    filter:blur(80px);

    opacity:.12;

    transition:
        opacity .35s ease,
        transform .35s ease;

    pointer-events:none;

}

.testimonial-card:hover::before{

    opacity:.25;

    transform:scale(1.15);

}

/*==================================================
QUOTE ICON
==================================================*/

.quote-icon{

    position:absolute;

    top:18px;

    right:20px;

    font-family:Georgia,serif;

    font-size:5rem;

    font-weight:bold;

    line-height:1;

    color:#ede6ff;

    opacity:.8;

    user-select:none;

    transition:
        transform .35s ease,
        color .35s ease;

}

.testimonial-card:hover .quote-icon{

    transform:rotate(-8deg) scale(1.08);

    color:#d9cbff;

}

/*==================================================
RATING
==================================================*/

.testimonial-rating{

    display:flex;

    flex-direction:column;

    gap:6px;

    margin-bottom:22px;

}

.stars{

    color:#f6b800;

    font-size:1.08rem;

    letter-spacing:3px;

    text-shadow:0 2px 10px rgba(246,184,0,.25);

    transition:transform .3s ease;

}

.testimonial-card:hover .stars{

    transform:scale(1.03);

}

.verified{

    display:inline-flex;

    align-items:center;

    gap:6px;

    font-size:.82rem;

    font-weight:600;

    color:#22a447;

}

/*==================================================
TESTIMONIAL TEXT
==================================================*/

.testimonial-card p{

    margin:0;

    color:#555;

    font-size:1rem;

    line-height:1.85;

    letter-spacing:.2px;

    display:-webkit-box;

    -webkit-line-clamp:5;

    -webkit-box-orient:vertical;

    overflow:hidden;

}

/*==================================================
TESTIMONIAL AVATAR
==================================================*/

.testimonial-avatar{

    width:62px;

    height:62px;

    border-radius:50%;

    object-fit:cover;

    flex-shrink:0;

    border:3px solid #fff;

    box-shadow:0 10px 22px rgba(0,0,0,.08);

    transition:
        transform .35s ease,
        box-shadow .35s ease;

}

.testimonial-card:hover .testimonial-avatar{

    transform:scale(1.06);

    box-shadow:0 14px 30px rgba(79,70,229,.18);

}

/*==================================================
AUTHOR
==================================================*/

.testimonial-author{

    display:flex;

    align-items:center;

    gap:16px;

    margin-top:30px;

    padding-top:22px;

    border-top:1px solid rgba(109,40,217,.08);

}

.author-info{

    display:flex;

    flex-direction:column;

    justify-content:center;

}

.author-info strong{

    color:#241c44;

    font-size:1rem;

    font-weight:700;

    margin-bottom:3px;

}

.author-info span{

    color:#888;

    font-size:.92rem;

}

/*==================================================
BOTTOM BUTTON
==================================================*/

.testimonials-preview .section-button{

    text-align:center;

    margin-top:60px;

}

.testimonials-preview .section-button .btn{

    display:inline-flex;

    align-items:center;

    justify-content:center;

    gap:10px;

    transition:
        transform .3s ease,
        box-shadow .3s ease;

}

.testimonials-preview .section-button .btn:hover{

    transform:translateY(-3px);

}

/*==================================================
EDGE FADE
==================================================*/

.testimonials-preview::before,

.testimonials-preview::after{

    content:"";

    position:absolute;

    top:0;

    width:90px;

    height:100%;

    pointer-events:none;

    z-index:5;

}

.testimonials-preview::before{

    left:0;

    background:linear-gradient(
        to right,
        #fcfbff 15%,
        rgba(252,251,255,0)
    );

}

.testimonials-preview::after{

    right:0;

    background:linear-gradient(
        to left,
        #fcfbff 15%,
        rgba(252,251,255,0)
    );

}

/*==================================================
DRAG CURSOR
==================================================*/

.testimonials-slider{

    cursor:grab;

}

.testimonials-slider.dragging{

    cursor:grabbing;

    user-select:none;

}

/*==================================================
RESPONSIVE
==================================================*/

@media (max-width:1100px){

.testimonial-card{

    flex:0 0 320px;

}

}

@media (max-width:768px){

.testimonials-preview{

    padding:80px 0;

}

.testimonials-preview .section-heading{

    margin-bottom:45px;

}

.testimonials-preview h2{

    font-size:2rem;

}

.testimonials-preview .section-heading p{

    font-size:1rem;

}

.testimonials-slider{

    gap:18px;

    padding-bottom:10px;

}

.testimonial-card{

    flex:0 0 85%;

    min-height:300px;

    padding:28px;

}

.quote-icon{

    font-size:4rem;

}

.testimonial-avatar{

    width:56px;

    height:56px;

}

.author-info strong{

    font-size:.98rem;

}

.author-info span{

    font-size:.88rem;

}

}

@media (max-width:480px){

.testimonials-preview{

    padding:70px 0;

}

.testimonials-preview h2{

    font-size:1.75rem;

}

.testimonial-card{

    flex:0 0 92%;

    min-height:280px;

    padding:24px;

}

.quote-icon{

    font-size:3.6rem;

}

.testimonial-avatar{

    width:52px;

    height:52px;

}

.stars{

    letter-spacing:2px;

}

.verified{

    font-size:.78rem;

}

}

/*==================================================
SMOOTH EXPERIENCE
==================================================*/

.testimonial-card,

.testimonial-avatar,

.quote-icon,

.stars,

.testimonials-preview .btn{

    will-change:transform;

}

/*==================================================
FOCUS ACCESSIBILITY
==================================================*/

.testimonials-preview a:focus-visible{

    outline:2px solid #6d28d9;

    outline-offset:4px;

    border-radius:8px;

}

/*==================================================
REDUCED MOTION
==================================================*/

@media (prefers-reduced-motion:reduce){

.testimonial-card,

.testimonial-avatar,

.quote-icon,

.stars,

.testimonials-slider,

.testimonials-preview .btn{

    transition:none !important;

    animation:none !important;

    scroll-behavior:auto;

}

}