@charset "utf-8";
/* CSS Document */

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

.testimonials
{
    background:#f8f7f3;
    padding:100px 0;
    color:#334155;
}


/* GRID */

.testimonials-grid
{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:2rem;
}


/* CARD */

.testimonial-card
{
    background:#ffffff;

    border-radius:24px;

    padding:2.5rem 2rem;

    text-align:center;

    box-shadow:
    0 20px 50px rgba(0,0,0,.06);

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

    position:relative;

    animation:fadeUp .8s ease both;
}


.testimonial-card:hover
{
    transform:translateY(-10px);

    box-shadow:
    0 30px 70px rgba(0,0,0,.12);
}



/* FOTO */

.client-photo
{
    width:90px;
    height:90px;

    margin:0 auto 1.2rem;

    border-radius:50%;

    overflow:hidden;

    border:4px solid #a87822;
}


.client-photo img
{
    width:100%;
    height:100%;

    object-fit:cover;

    display:block;
}



/* STARS */

.stars
{
    color:#a87822;

    letter-spacing:3px;

    font-size:1.1rem;

    margin-bottom:1.2rem;
}



/* TEXTO */

.testimonial-card p,.section-header p
{
    color:#334155;

    line-height:1.8;

    margin-bottom:2rem;

    font-size:1rem;
}



/* CLIENTE */

.client-info strong
{
    display:block;

    color:#12483c;

    font-size:1.1rem;

    font-weight:700;
}


.client-info span
{
    color:#64748b;

    font-size:.9rem;
}



/* ANIMACION */

@keyframes fadeUp
{
    from
    {
        opacity:0;

        transform:translateY(30px);
    }

    to
    {
        opacity:1;

        transform:translateY(0);
    }
}



/* ACCESIBILIDAD */

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

    .testimonial-card
    {
        animation:none;
        transition:none;
    }

}



/* TABLET */

@media(max-width:992px)
{

    .testimonials
    {
        padding:80px 0;
    }


    .testimonials-grid
    {
        grid-template-columns:repeat(2,1fr);
    }

}



/* MOBILE */

@media(max-width:576px)
{

    .testimonials
    {
        padding:60px 0;
    }


    .testimonials-grid
    {
        grid-template-columns:1fr;

        gap:1.5rem;
    }


    .testimonial-card
    {
        padding:2rem 1.5rem;

        border-radius:20px;
    }


    .stars
    {
        font-size:1rem;
    }

}