/* Carrossel de avaliações reais do Google, na coluna direita da seção de depoimentos */
.stories-intro {
  display: flex;
  flex-direction: column;
}

.stories h2 {
  font-family: var(--display, 'Jost', sans-serif);
  font-size: clamp(2.3rem, 3.4vw, 3.4rem);
  line-height: 1.14;
  letter-spacing: -0.025em;
  color: var(--cream);
}

.stories h2 span {
  color: var(--sand);
}

.stories p {
  margin-top: 18px;
  font-size: 15px;
  line-height: 1.6;
  color: #eed5bf;
  max-width: 48ch;
  text-wrap: pretty;
}

.reviews {
  --review-duration: 8s;
  min-width: 0;
  border-left: 1px solid var(--line);
  padding: 8px 0 8px 64px;
  display: flex;
  flex-direction: column;
}
.reviews-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  margin-bottom: 26px;
}
.reviews .quote-icon { width: 38px; height: auto; color: var(--copper); flex: none; }
.reviews-badge {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 7px 12px;
  border: 1px solid var(--line);
  border-radius: 999px;
  font: 500 12px/1 var(--body);
  color: #e4cbb3;
  text-decoration: none;
  white-space: nowrap;
  transition: border-color .25s ease, background-color .25s ease;
}
.reviews-badge:hover, .reviews-badge:focus-visible { border-color: rgba(232, 211, 189, .5); background: rgba(246, 239, 229, .05); }
.reviews-badge strong { color: var(--cream); font-weight: 700; }
.reviews-badge .stars { color: #f2b544; letter-spacing: 1px; }
.reviews-badge svg { width: 14px; height: 14px; flex: none; }

/* Slides empilhados na mesma célula: a altura é a do maior card, então todos ficam iguais */
.reviews-viewport { display: grid; touch-action: pan-y; overflow: hidden; }
.review {
  grid-area: 1 / 1;
  display: flex;
  flex-direction: column;
  min-width: 0;
  color: inherit;
  text-decoration: none;
  opacity: 0;
  visibility: hidden;
  transform: translateX(18px);
  transition: opacity .9s cubic-bezier(.22, .61, .36, 1), transform .9s cubic-bezier(.22, .61, .36, 1), visibility 0s linear .9s;
}
.review.is-leaving { transform: translateX(-18px); }
.review.is-active {
  opacity: 1;
  visibility: visible;
  transform: none;
  transition: opacity .9s cubic-bezier(.22, .61, .36, 1) .15s, transform .9s cubic-bezier(.22, .61, .36, 1) .15s, visibility 0s;
}
.review-rating { display: flex; align-items: center; gap: 12px; font: 400 12px/1 var(--body); color: #c9a78c; }
.review-rating .stars { color: #f2b544; font-size: 15px; letter-spacing: 2px; }
.review-rating .stars .off { color: rgba(232, 211, 189, .28); }
.reviews .review-text {
  flex: 1;
  margin: 16px 0 0;
  font: 300 19px/1.55 var(--display);
  color: #e4cbb3;
  white-space: pre-line;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 7;
  line-clamp: 7;
  overflow: hidden;
}
.review-author { display: flex; align-items: center; gap: 14px; margin-top: 24px; min-width: 0; }
.review-avatar {
  flex: none;
  width: 42px;
  height: 42px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  font: 600 14px/1 var(--body);
  color: var(--cream);
  background: var(--tint, var(--copper));
}
.review-author > div { min-width: 0; }
.review-name, .review-meta { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.review-name { font: 500 16px/1.3 var(--display); color: var(--cream); }
.review-meta { font: 400 11px/1.5 var(--body); color: #b89880; }
.review-footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-top: 18px;
  padding-top: 16px;
  border-top: 1px solid var(--line);
}
.review-tag {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  padding: 5px 10px;
  border-radius: 999px;
  background: rgba(183, 104, 62, .2);
  color: #f2d1b3;
  font: 500 11px/1.2 var(--body);
}
.review-link { display: inline-flex; align-items: center; gap: 7px; flex: none; font: 500 12px/1 var(--body); color: #d0af94; transition: color .25s ease; }
.review-link svg { width: 14px; height: 14px; }
.review-link .icon { width: 11px; height: 11px; fill: none; stroke: currentColor; stroke-width: 2.2; }
.review:hover .review-link, .review:focus-visible .review-link { color: var(--cream); }
.review:focus-visible { outline: 2px solid var(--sand); outline-offset: 6px; border-radius: 4px; }

.reviews-foot { display: flex; align-items: center; gap: 20px; margin-top: 24px; }
.reviews-dots { display: flex; gap: 4px; }
.reviews-dots button {
  width: 24px;
  height: 24px;
  padding: 0;
  border: 0;
  background: none;
  cursor: pointer;
  display: grid;
  place-items: center;
}
.reviews-dots button::before {
  content: "";
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: rgba(232, 211, 189, .3);
  transition: background-color .3s ease, transform .3s ease;
}
.reviews-dots button[aria-current="true"]::before { background: var(--sand); transform: scale(1.25); }
.reviews-dots button:focus-visible { outline: 2px solid var(--sand); border-radius: 50%; }
.reviews-progress { flex: 1; height: 1px; background: var(--line); overflow: hidden; }
.reviews-progress span { display: block; height: 100%; background: var(--sand); transform: scaleX(0); transform-origin: left; }
.reviews-progress span.is-running { animation: reviews-progress var(--review-duration) linear forwards; }
.reviews.is-paused .reviews-progress span { animation-play-state: paused; }
@keyframes reviews-progress { to { transform: scaleX(1); } }

@media (max-width: 1100px) { .reviews { padding-left: 35px; } .reviews .review-text { font-size: 18px; } }
@media (max-width: 800px) {
  .reviews { border-left: 0; border-top: 1px solid var(--line); margin-top: 34px; padding: 28px 0 0; }
  .reviews .review-text { -webkit-line-clamp: 8; line-clamp: 8; }
}
@media (max-width: 580px) {
  .stories {
    padding-block: 54px 48px;
  }
  .stories h2 {
    font-size: clamp(2.05rem, 8vw, 2.55rem);
    line-height: 1.16;
    letter-spacing: -0.02em;
  }
  .stories p {
    margin-top: 15px;
    font-size: 14.5px;
    line-height: 1.58;
    color: #eed5bf;
    max-width: 100%;
    text-wrap: pretty;
  }
  .reviews {
    margin-top: 30px;
    padding-top: 24px;
  }
  .reviews-head { margin-bottom: 20px; }
  .reviews .quote-icon { width: 30px; }
  .reviews .review-text { font-size: 16px; line-height: 1.55; }
}
@media (prefers-reduced-motion: reduce) {
  .review, .review.is-active { transition: none; transform: none; }
  .reviews-progress { visibility: hidden; }
}
