/*==================================================
DAYAL PARADISE V2
Testimonials
assets/css/testimonials.css
==================================================*/

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

.testimonials{

    position:relative;

    overflow:hidden;

    background:
    linear-gradient(
        180deg,
        #070707 0%,
        #101010 50%,
        #070707 100%
    );

}

.testimonials::before{

    content:"";

    position:absolute;

    width:900px;
    height:900px;

    left:-350px;
    top:-350px;

    border-radius:50%;

    background:
    radial-gradient(circle,
    rgba(216,179,106,.08),
    transparent 72%);

    pointer-events:none;

}

.testimonials::after{

    content:"";

    position:absolute;

    width:700px;
    height:700px;

    right:-250px;
    bottom:-250px;

    border-radius:50%;

    background:
    radial-gradient(circle,
    rgba(216,179,106,.05),
    transparent 70%);

}

/*==================================
GRID
==================================*/

.testimonial-grid{

    display:grid;

    grid-template-columns:repeat(2,1fr);

    gap:35px;

    margin-top:70px;

}

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

.testimonial-card{

    position:relative;

    overflow:hidden;

    padding:42px;

    border-radius:28px;

    background:

    rgba(18,18,18,.92);

    backdrop-filter:blur(18px);

    border:1px solid rgba(216,179,106,.15);

    transition:.4s;

}

.testimonial-card:hover{

    transform:translateY(-12px);

    border-color:rgba(216,179,106,.35);

    box-shadow:

    0 30px 80px rgba(0,0,0,.40);

}

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

.quote-icon{

    position:absolute;

    top:25px;
    right:35px;

    font-size:90px;

    line-height:1;

    color:rgba(216,179,106,.18);

    font-family:serif;

    user-select:none;

}

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

.testimonial-card p{

    margin-top:20px;

    color:var(--text);

    font-size:17px;

    line-height:1.9;

}

.testimonial-card h3{

    font-size:30px;

    margin-bottom:20px;

    font-family:'Cormorant Garamond',serif;

}

/*==================================
FOOTER
==================================*/

.testimonial-footer{

    display:flex;

    align-items:center;

    gap:18px;

    margin-top:35px;

}

.testimonial-footer img{

    width:72px;
    height:72px;

    border-radius:50%;

    object-fit:cover;

    border:3px solid rgba(216,179,106,.30);

}

.testimonial-footer h4{

    margin-bottom:6px;

    font-size:20px;

}

.testimonial-footer span{

    color:var(--gold);

    font-size:14px;

    letter-spacing:1px;

}

/*==================================
FEATURED
==================================*/

.testimonial-card.featured{

    background:

    linear-gradient(
        135deg,
        rgba(216,179,106,.14),
        rgba(15,15,15,.96)
    );

    border:1px solid rgba(216,179,106,.35);

}

.testimonial-card.featured .quote-icon{

    color:var(--gold);

    font-size:70px;

}

.testimonial-card.featured h3{

    color:var(--gold-light);

}

/*==================================
SHINE
==================================*/

.testimonial-card::before{

    content:"";

    position:absolute;

    top:0;
    left:-120%;

    width:40%;
    height:100%;

    background:

    linear-gradient(
        90deg,
        transparent,
        rgba(255,255,255,.08),
        transparent
    );

    transition:1s;

}

.testimonial-card:hover::before{

    left:160%;

}

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

.testimonial-card::after{

    content:"";

    position:absolute;

    inset:0;

    border-radius:inherit;

    box-shadow:

    inset 0 0 0 1px rgba(255,255,255,.03);

    pointer-events:none;

}

/*==================================
PROFILE FLOAT
==================================*/

.testimonial-footer img{

    transition:.35s;

}

.testimonial-card:hover img{

    transform:scale(1.08);

}

/*==================================
ANIMATION
==================================*/

.testimonial-card{

    animation:testimonialFloat 8s ease-in-out infinite;

}

.testimonial-card:nth-child(2){

    animation-delay:1s;

}

.testimonial-card:nth-child(3){

    animation-delay:2s;

}

.testimonial-card:nth-child(4){

    animation-delay:3s;

}

@keyframes testimonialFloat{

0%,100%{

transform:translateY(0);

}

50%{

transform:translateY(-6px);

}

}

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

@media(max-width:1100px){

.testimonial-grid{

grid-template-columns:1fr;

}

}

@media(max-width:768px){

.testimonial-card{

padding:30px;

}

.quote-icon{

font-size:70px;

right:20px;

}

.testimonial-card h3{

font-size:24px;

}

.testimonial-footer img{

width:60px;
height:60px;

}

}

@media(max-width:480px){

.testimonial-card{

padding:24px;

}

.quote-icon{

font-size:55px;

}

.testimonial-card p{

font-size:15px;

}

.testimonial-footer{

flex-direction:column;

text-align:center;

}

}