/*==================================================

GOOGLE REVIEWS PREMIUM

==================================================*/

.reviews-premium{

padding:150px 0;

background:#f6f8fc;

overflow:hidden;

position:relative;

}

.reviews-premium::before{

content:"";

position:absolute;

width:700px;

height:700px;

border-radius:50%;

background:rgba(200,164,93,.05);

top:-350px;

right:-250px;

}

.reviews-premium::after{

content:"";

position:absolute;

width:500px;

height:500px;

border-radius:50%;

background:rgba(16,34,77,.03);

left:-180px;

bottom:-180px;

}


/*==================================

HEADER

==================================*/

.reviews-header{

display:flex;

justify-content:space-between;

align-items:end;

margin-bottom:70px;

}

.reviews-header h2{

font-size:64px;

color:var(--azul);

margin-bottom:18px;

line-height:1.05;

}

.reviews-header p{

font-size:19px;

color:#666;

max-width:650px;

}


/*==================================

BOTONES

==================================*/

.reviews-buttons{

display:flex;

gap:15px;

}

.reviews-buttons button{

width:62px;

height:62px;

border:none;

border-radius:50%;

background:white;

font-size:22px;

color:var(--azul);

box-shadow:0 18px 40px rgba(0,0,0,.08);

transition:.35s;

}

.reviews-buttons button:hover{

background:var(--azul);

color:white;

transform:translateY(-5px);

}


/*==================================

SLIDER

==================================*/

.reviews-slider{

display:flex;

gap:35px;

overflow-x:auto;

scroll-behavior:smooth;

padding-bottom:20px;

scrollbar-width:none;

}

.reviews-slider::-webkit-scrollbar{

display:none;

}


/*==================================

CARD

==================================*/

.review-card{

min-width:470px;

max-width:470px;

background:white;

border-radius:30px;

padding:45px;

position:relative;

overflow:hidden;

box-shadow:0 25px 60px rgba(0,0,0,.08);

transition:.40s;

border:1px solid rgba(0,0,0,.05);

}

.review-card:hover{

transform:translateY(-12px);

box-shadow:0 40px 90px rgba(0,0,0,.14);

border-color:var(--dorado);

}


/*==================================

DESTACADA

==================================*/

.featured-review{

background:linear-gradient(135deg,#10224d,#1b3167);

color:white;

}

.featured-review h3,

.featured-review span,

.featured-review .review-text{

color:white;

}

.featured-review .verified{

background:rgba(255,255,255,.12);

color:white;

}

.featured-review .review-photo{

border-color:white;

}


/*==================================

TOP

==================================*/

.review-top{

display:flex;

align-items:center;

gap:20px;

margin-bottom:30px;

}

.review-photo{

width:78px;

height:78px;

border-radius:50%;

overflow:hidden;

border:5px solid #eef3fb;

flex-shrink:0;

}

.review-photo img{

width:100%;

height:100%;

object-fit:cover;

}

.review-top h3{

font-size:28px;

color:var(--azul);

margin:0;

}

.review-top span{

font-size:15px;

color:#888;

display:block;

margin-top:5px;

}
/*==========================================

ESTRELLAS

==========================================*/

.google-stars{

display:inline-flex;

gap:3px;

margin-top:10px;

font-size:18px;

letter-spacing:2px;

color:#FDBA12;

}


/*==========================================

VERIFICADO

==========================================*/

.verified{

display:inline-flex;

align-items:center;

gap:10px;

padding:10px 18px;

margin-bottom:30px;

border-radius:50px;

background:#eef5ff;

color:var(--azul);

font-size:13px;

font-weight:700;

letter-spacing:1px;

text-transform:uppercase;

}

.verified i{

color:#0d6efd;

font-size:18px;

}


/*==========================================

TEXTO

==========================================*/

.review-text{

position:relative;

font-size:17px;

line-height:2;

color:#666;

z-index:2;

}

.review-text::before{

content:"“";

position:absolute;

left:-10px;

top:-65px;

font-family:'Cormorant Garamond',serif;

font-size:180px;

line-height:1;

color:rgba(200,164,93,.12);

z-index:-1;

}

.featured-review .review-text::before{

color:rgba(255,255,255,.08);

}


/*==========================================

HOVER

==========================================*/

.review-card:hover .review-photo{

transform:scale(1.08);

}

.review-photo{

transition:.35s;

}

.review-card:hover .google-stars{

transform:scale(1.05);

}

.google-stars{

transition:.35s;

}

.review-card:hover .verified{

background:var(--azul);

color:white;

}

.review-card:hover .verified i{

color:#f4d48e;

}


/*==========================================

BORDE SUPERIOR

==========================================*/

.review-card::after{

content:"";

position:absolute;

left:0;

top:0;

width:100%;

height:6px;

background:linear-gradient(90deg,

var(--dorado),

#f6d89b);

transform:scaleX(0);

transform-origin:left;

transition:.45s;

}

.review-card:hover::after{

transform:scaleX(1);

}

.featured-review::after{

background:white;

transform:scaleX(1);

}


/*==========================================

SCROLL

==========================================*/

.reviews-slider{

cursor:grab;

}

.reviews-slider:active{

cursor:grabbing;

}


/*==========================================

RESPONSIVE

==========================================*/

@media(max-width:1200px){

.review-card{

min-width:430px;

max-width:430px;

}

}

@media(max-width:992px){

.reviews-premium{

padding:100px 0;

}

.reviews-header{

display:block;

}

.reviews-buttons{

margin-top:35px;

}

.reviews-header h2{

font-size:46px;

}

.review-card{

min-width:390px;

max-width:390px;

}

}

@media(max-width:768px){

.review-card{

min-width:330px;

max-width:330px;

padding:35px;

}

.review-top h3{

font-size:24px;

}

.review-text{

font-size:16px;

line-height:1.8;

}

}

@media(max-width:576px){

.reviews-premium{

padding:80px 0;

}

.reviews-header h2{

font-size:34px;

}

.review-card{

min-width:88vw;

max-width:88vw;

padding:30px;

border-radius:22px;

}

.review-photo{

width:65px;

height:65px;

}

.review-top{

gap:15px;

}

.reviews-buttons{

display:none;

}

}