/* Testimonials — Figma 625:18798 (1920: px 60, image 780 × 896, 40px gap). */
.eva-testi-section { display: block; }
.eva-testi {
  padding-top: max(calc(var(--eva-pt, 0) * 0.5px), min(calc(var(--eva-pt, 0) * 1px), calc(var(--eva-pt, 0) * 0.05208vw)));
  padding-bottom: max(calc(var(--eva-pb, 0) * 0.4px), min(calc(var(--eva-pb, 0) * 1px), calc(var(--eva-pb, 0) * 0.05208vw)));
}
.eva-testi__inner { padding-inline: clamp(20px, 3.125vw, 60px); }

.eva-testi__head {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 20px;
  margin-bottom: clamp(32px, 3.125vw, 60px);
  text-align: center;
}
.eva-testi__rule { display: block; width: 60px; height: 2px; background: currentColor; }

.eva-testi__body {
  --eva-testi-media: 43.333%;
  --eva-testi-gap: clamp(24px, 2.0833vw, 40px);
  position: relative;
  display: block;
}

/* Avatars sit above the right column on desktop */
.eva-testi__avatars {
  position: absolute;
  top: 0;
  left: calc(var(--eva-testi-media) + var(--eva-testi-gap));
  right: 0;
  z-index: 1;
  display: flex;
  gap: clamp(12px, 1.136vw, 21.8px);
  overflow-x: auto;
  scrollbar-width: none;
  padding: 4px;
  margin: -4px;
}
.eva-testi__avatars::-webkit-scrollbar { display: none; }
.eva-testi__avatar {
  flex: none;
  width: clamp(56px, 4.1667vw, 80px);
  aspect-ratio: 1;
  padding: 0;
  border: 2px solid #F0B656;
  border-radius: 50%;
  overflow: hidden;
  background: var(--eva-sabia);
  cursor: pointer;
  opacity: 0.7;
  transition: opacity 0.25s var(--eva-ease), box-shadow 0.25s var(--eva-ease);
}
.eva-testi__avatar img { display: block; width: 100%; height: 100%; object-fit: cover; }
.eva-testi__avatar:hover { opacity: 1; }
.eva-testi__avatar[aria-selected="true"] { opacity: 1; box-shadow: 0 0 0 2px var(--eva-crema), 0 0 0 3px var(--eva-bosque); }

.eva-testi__panel {
  display: grid;
  grid-template-columns: var(--eva-testi-media) minmax(0, 1fr);
  gap: var(--eva-testi-gap);
  align-items: stretch;
}
.eva-testi__panel[hidden] { display: none; }
.eva-testi__panel:not([hidden]) { animation: evaTestiIn 0.5s var(--eva-ease); }
@keyframes evaTestiIn { from { opacity: 0; } to { opacity: 1; } }

.eva-testi__media { position: relative; aspect-ratio: 780 / 896; overflow: hidden; background: var(--eva-sabia); }
.eva-testi__media img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }

/* Right column: avatars (80) + 40 gap, then the card (pt 40, px 60, pb 20) */
.eva-testi__content {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  gap: 40px;
  padding: calc(clamp(56px, 4.1667vw, 80px) + var(--eva-testi-gap) + clamp(20px, 2.0833vw, 40px)) clamp(0px, 3.125vw, 60px) clamp(12px, 1.0417vw, 20px);
}
.eva-testi__figure { margin: 0; display: flex; flex-direction: column; gap: clamp(24px, 2.0833vw, 40px); max-width: 860px; }

.eva-testi__stars { position: relative; display: inline-block; width: 132px; height: 24px; color: var(--eva-bosque); }
.eva-testi__stars-row { position: absolute; inset: 0 auto 0 0; display: flex; gap: 3px; overflow: hidden; white-space: nowrap; }
.eva-testi__stars-row svg { flex: none; width: 24px; height: 24px; }
.eva-testi__stars-row--bg { color: rgba(44, 44, 44, 0.15); }
.eva-testi__stars-row--fg { width: calc(var(--eva-rating, 5) * 20%); }

.eva-testi__quote { margin: 0; }
.eva-testi__quote p {
  margin: 0;
  font-family: "Helvetica Neue", Helvetica, var(--eva-sans);
  font-weight: 300;
  font-size: clamp(19px, 1.3542vw, 26px);
  line-height: 1.2;
  letter-spacing: 0;
}
.eva-testi__author {
  font-size: var(--eva-fs-eyebrow);
  line-height: 30px;
  letter-spacing: 0.05em;
}
.eva-testi a.eva-testi__handle,
.eva-testi .eva-testi__handle { color: inherit; font-weight: 700; text-decoration: none; }
.eva-testi a.eva-testi__handle:hover { text-decoration: underline; text-underline-offset: 3px; }

/* Product tag card (475 wide, mustard) */
.eva-testi__product {
  display: flex;
  align-items: flex-end;
  gap: 13px;
  width: min(475px, 100%);
  padding: 13px;
  background: #F0B656;
  color: #391613;
}
.eva-testi__product-img { flex: none; width: 74px; aspect-ratio: 1; overflow: hidden; background: rgba(255, 255, 255, 0.4); }
.eva-testi__product-img img { width: 100%; height: 100%; object-fit: cover; }
.eva-testi__product-info { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 5px; align-self: center; }
.eva-testi a.eva-testi__product-title {
  overflow: hidden;
  color: #391613;
  font-family: var(--eva-serif);
  font-weight: 700;
  font-size: clamp(19px, 1.237vw, 23.75px);
  line-height: 1.2;
  white-space: nowrap;
  text-overflow: ellipsis;
  text-decoration: none;
}
.eva-testi__product-price { font-family: "Helvetica Neue", Helvetica, var(--eva-sans); font-size: clamp(16px, 1.028vw, 19.7px); line-height: 1.6; letter-spacing: 0; }
.eva-testi__product-form { flex: none; }
.eva-testi .eva-testi__quick {
  position: relative;
  display: inline-flex;
  width: 40px;
  height: 40px;
  padding: 0;
  border: 0;
  border-radius: 50%;
  background: none;
  color: #391613;
  cursor: pointer;
  transition: transform 0.2s var(--eva-ease);
}
.eva-testi .eva-testi__quick:hover { transform: scale(1.08); }
.eva-testi__quick .icon-loading { display: none; position: absolute; inset: 11px; width: 18px; height: 18px; color: var(--eva-mustard); }
.eva-testi__quick.loading svg:first-child { visibility: hidden; }
.eva-testi__quick.loading .icon-loading { display: block; }

@media (max-width: 959px) {
  .eva-testi__avatars { position: static; margin: 0 calc(var(--eva-gutter) * -1) 20px; padding: 4px var(--eva-gutter); }
  .eva-testi__panel { grid-template-columns: 1fr; gap: 24px; }
  .eva-testi__media { aspect-ratio: 4 / 5; }
  .eva-testi__content { padding: 0; gap: 28px; }
}
/* eva: keep long testimonials inside the screen on phones */ .eva-testi .eva-testi__panel > * { min-width: 0; } .eva-testi .eva-testi__media img, .eva-testi .eva-testi__media video { max-width: 100%; } @media (max-width: 959px) { .eva-testi .eva-testi__panel { grid-template-columns: minmax(0, 1fr); } }