/* ═══════════════════════════════════════════════════
   AVIS CLIENTS — Carrousel fiche produit
══════════════════════════════════════════════════ */

.spr-wrap {
  padding: 48px 0 56px;
  border-top: 1px solid #e5e7eb;
  overflow: hidden;
  max-width: 100%;
}

/* ── Header ── */
.spr-header { text-align: center; max-width: 700px; margin: 0 auto 32px; }
.spr-trust {
  display: inline-flex; align-items: center; gap: 10px; margin-bottom: 10px;
}
.spr-trust-label { font-size: 15px; font-weight: 700; color: #1a7a3c; letter-spacing: .3px; }
.spr-trust-stars { display: inline-flex; gap: 3px; }
.spr-trust-star {
  width: 24px; height: 24px; background: #1a7a3c;
  display: flex; align-items: center; justify-content: center; border-radius: 4px;
}
.spr-trust-star svg { width: 14px; height: 14px; fill: #fff; }

.spr-title {
  font-size: clamp(22px, 4vw, 36px); font-weight: 800;
  color: #111827; line-height: 1.2; margin: 0 0 8px;
}
.spr-title u {
  text-decoration: underline; text-decoration-color: #1a7a3c;
  text-underline-offset: 5px; text-decoration-thickness: 3px;
}
.spr-subtitle { font-size: 14px; color: #6b7280; margin: 0; }

/* ── Track ── */
.spr-track-wrap { overflow: hidden; position: relative; }
.spr-track {
  display: flex; gap: 20px;
  transition: transform .5s cubic-bezier(.25,.8,.25,1);
}

/* ── Card ── */
.spr-card {
  flex: 0 0 calc(25% - 15px); min-width: 0;
  background: #fff; border-radius: 16px;
  overflow: hidden; display: flex; flex-direction: column;
  box-shadow: 0 2px 16px rgba(0,0,0,.05);
  transition: transform .3s ease, box-shadow .3s ease;
}
.spr-card:hover { transform: translateY(-4px); box-shadow: 0 10px 32px rgba(0,0,0,.09); }

/* Image */
.spr-img { width: 100%; aspect-ratio: 4/3; overflow: hidden; }
.spr-img img { width: 100%; height: 100%; object-fit: cover; transition: transform .5s ease; }
.spr-card:hover .spr-img img { transform: scale(1.04); }

/* Corps */
.spr-body { padding: 18px 18px 20px; display: flex; flex-direction: column; flex: 1; gap: 10px; }

/* Rating row */
.spr-rating { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.spr-stars { display: inline-flex; gap: 2px; }
.spr-star {
  width: 22px; height: 22px; background: #1a7a3c;
  display: flex; align-items: center; justify-content: center; border-radius: 3px;
}
.spr-star svg { width: 13px; height: 13px; fill: #fff; }
.spr-verified {
  display: inline-flex; align-items: center; gap: 4px;
  font-size: 11px; font-weight: 600; color: #374151;
  background: #f3f4f6; padding: 3px 9px; border-radius: 50px;
}
.spr-verified svg { width: 13px; height: 13px; stroke: #1a7a3c; }

/* Texte */
.spr-text {
  font-size: 13.5px; line-height: 1.65; color: #444; margin: 0; flex: 1;
  display: -webkit-box; -webkit-line-clamp: 6; -webkit-box-orient: vertical; overflow: hidden;
}

/* Auteur */
.spr-author { font-size: 14px; font-weight: 700; color: #111827; }
.spr-date { font-size: 12px; color: #9ca3af; margin-top: -4px; }

/* ── Navigation ── */
.spr-nav { display: flex; justify-content: center; gap: 12px; margin-top: 28px; }
.spr-arr {
  width: 48px; height: 48px; border-radius: 50%;
  background: #1a7a3c; color: #fff; border: none;
  cursor: pointer; display: flex; align-items: center; justify-content: center;
  transition: background .25s, transform .25s;
}
.spr-arr:hover { background: #15803d; transform: scale(1.06); }
.spr-arr:disabled { opacity: .3; cursor: default; transform: none; }

/* Dots mobile */
.spr-dots { display: none; justify-content: center; gap: 8px; margin-top: 20px; }
.spr-dot {
  width: 10px; height: 10px; border-radius: 50%;
  background: rgba(26,122,60,.2); border: none; padding: 0; cursor: pointer;
  transition: all .35s;
}
.spr-dot.active { background: #1a7a3c; width: 28px; border-radius: 5px; }

/* ── Responsive ── */
@media (max-width: 1100px) { .spr-card { flex: 0 0 calc(33.333% - 14px); } }
@media (max-width: 820px)  {
  .spr-card { flex: 0 0 calc(50% - 10px); }
  .spr-track { gap: 16px; }
}
@media (max-width: 580px) {
  .spr-wrap { padding: 32px 0 40px; }
  .spr-card {
    flex: 0 0 calc(85vw - 28px); min-width: min(270px, calc(100vw - 48px));
    scroll-snap-align: center;
  }
  .spr-track {
    overflow-x: auto; scroll-snap-type: x mandatory;
    -webkit-overflow-scrolling: touch; scrollbar-width: none;
  }
  .spr-track::-webkit-scrollbar { display: none; }
  .spr-nav { display: none; }
  .spr-dots { display: flex; }
  .spr-body { padding: 14px 14px 16px; }
  .spr-text { font-size: 13px; -webkit-line-clamp: 5; }
}