/* ==========================================================================
   AVALIAÇÕES — cards centralizados + FUNDO BRANCO + BARRA ANIMADA
   ========================================================================== */
.reviews-showcase{
  --white:#FFFFFF; --green:#95C93D; --navy:#212C65; --blue:#3D76BB; --muted:#F6F9FF; --border:#E7EBF3;
  background: var(--white); color: var(--navy); padding-block: clamp(40px, 7vw, 110px);
  position: relative; isolation: isolate;
  letter-spacing: 1px;
  font-weight: 300;
}
.reviews-showcase__inner{ max-width:1120px; margin-inline:auto; padding-inline:clamp(16px, 3vw, 28px); }

.reviews-bar{
  display:block; width: clamp(220px, 44%, 520px); height: 6px; border-radius:999px;
  background: linear-gradient(90deg, var(--green), var(--blue));
  margin: 0 auto clamp(16px, 2.6vw, 22px);
  position: relative; will-change: transform; animation: reviewsBarSlide 6s ease-in-out infinite alternate;
}
@keyframes reviewsBarSlide{ from{ transform: translateX(-8px) } to{ transform: translateX(8px) } }

.reviews-title{
  margin: 0; text-align: center; color: var(--navy);
  font-weight: 900; letter-spacing: 16px; text-transform: uppercase;
  line-height: .98; font-size: clamp(2.2rem, 6vw, 3.2rem);
}
.reviews-subtitle{
  margin: clamp(10px, 1.8vw, 14px) auto clamp(28px, 5vw, 48px);
  max-width: 880px; text-align: center; color: color-mix(in srgb, var(--navy) 70%, #0000 30%);
  line-height: 1.75; font-size: clamp(1.02rem, 2vw, 1.18rem);
}
.reviews-stage{ display:block; }
.reviews-cards{
  width: min(980px, 100%); margin-inline: auto;
  display:grid; grid-template-columns: repeat(2, minmax(280px, 1fr));
  gap: clamp(18px, 2.6vw, 26px); align-items: stretch;
}
.reviews-card{
  position:relative; display:flex; flex-direction:column;
  border-radius:14px; border: 1px solid var(--border); background:#fff;
  box-shadow: 0 8px 24px rgba(33,44,101,.08);
  padding: clamp(18px, 2.4vw, 24px); min-height: clamp(200px, 26vw, 280px);
  transition: transform .16s ease, box-shadow .22s ease, border-color .22s ease;
  opacity: 0; transform: translateY(14px); animation: rvFadeUp .5s ease-out forwards;
}
.reviews-card:nth-child(2){ animation-delay: .06s } .reviews-card:nth-child(3){ animation-delay: .12s } .reviews-card:nth-child(4){ animation-delay: .18s }
.reviews-card:hover, .reviews-card:focus-within{
  transform: translateY(-2px);
  border-color: color-mix(in srgb, var(--blue) 40%, var(--border) 60%);
  box-shadow: 0 14px 40px rgba(33,44,101,.14);
}
@keyframes rvFadeUp{ from{ opacity:0; transform: translateY(14px) } to{ opacity:1; transform: translateY(0) } }

.rc-head{ display:flex; align-items:center; gap:12px; margin-bottom:10px; }
.avatar{
  width:54px; height:54px; border-radius:50%; display:grid; place-items:center; flex:0 0 54px;
  background: color-mix(in srgb, var(--blue) 88%, #fff 12%); color:#fff; font-weight:900; font-size:1.1rem;
  box-shadow: 0 2px 6px rgba(0,0,0,.10);
}
.avatar__fallback{ display:grid; place-items:center; width:100%; height:100%; }
.rc-id{ display:flex; align-items:center; gap:10px; min-width:0; }
.rc-name{ color: var(--navy); font-weight:800; font-size: 1.06rem; white-space:nowrap; text-overflow:ellipsis; overflow:hidden; }
.rc-rating{ display:inline-flex; align-items:center; gap:6px; flex-shrink:0; }
.rc-star{ width:20px; height:20px; fill: var(--green); }
.rc-score{ font-size:.9rem; font-weight:800; color:var(--navy); background: var(--muted); padding:3px 10px; border-radius:999px; }
.rc-text{
  margin:8px 0 0; color: color-mix(in srgb, var(--navy) 85%, #0000 15%);
  font-size: clamp(1rem, 1.8vw, 1.1rem); line-height: 1.65; text-align: justify; word-break: break-word;
}


/* <=980px (já existia) */
@media (max-width:440px){
  .reviews-title{font-size: 24px;}
  .reviews-subtitle{font-size: 14px;}
  .rc-text{font-size: 14px;}
}
@media (max-width:368px){
  .reviews-title{font-size: 14px;}
  .reviews-subtitle{font-size: 12px;}
  .rc-text{font-size: 12px;}
}
@media (max-width:300px){
  .reviews-title{font-size: 10px;}
}
/* <=980px (já existia) */
@media (max-width:980px){
  .reviews-cards{ grid-template-columns: repeat(2, minmax(240px, 1fr)); }
  .reviews-card{ min-height: clamp(190px, 34vw, 260px); }
}

/* <=720px (já existia) */
@media (max-width:720px){
  .reviews-cards{ grid-template-columns: 1fr; max-width: 640px; }
  .reviews-card{ min-height: unset; padding: 16px; }
  .avatar{ width:50px; height:50px; font-size:1rem; }
}