/**
 * SKSculpts Premium — Reviews
 * HTML uses: .sks-v108-section.sks-reviews, .sks-v108-container,
 *            .sks-section-head, .sks-v108-heading, .sks-v108-kicker,
 *            .sks-reviews-track.sk-products, .sks-review-card
 * Depends on: tokens.css, craft.css (for shared .sks-v108-* styles)
 */

/* ============================================================
   REVIEWS SECTION
   ============================================================ */
.sks-reviews {
  padding: clamp(30px, 4.5vw, 56px) 0;
  background: var(--sk-bg);
}
html[data-theme="dark"] .sks-reviews {
  background: linear-gradient(135deg, #171f25, #211f1b) !important;
}

/* ============================================================
   REVIEWS TRACK
   The track uses .sks-reviews-track AND .sk-products (grid layout)
   ============================================================ */
.sks-reviews-track {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: clamp(10px, 1.4vw, 18px);
}

/* ============================================================
   REVIEW CARD
   ============================================================ */
.sks-review-card {
  background: var(--sk-card);
  border: 1px solid var(--sk-border);
  border-radius: 0;
  overflow: hidden;
  padding: 30px 26px;
  transition: transform 0.25s ease, box-shadow 0.25s ease, border-color 0.25s ease;
}
.sks-review-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 22px 40px rgba(17, 24, 39, 0.12);
  border-color: rgba(201, 164, 92, 0.34);
}
.sks-review-stars {
  color: var(--sk-gold2);
  font-size: 1.05rem;
  margin-bottom: 12px;
}
.sks-review-card blockquote {
  font-family: var(--sk-font-display) !important;
  font-size: 1.05rem;
  line-height: 1.6;
  margin: 0 0 16px;
  color: var(--sk-text);
}
.sks-review-meta {
  font-size: 0.88rem;
  color: var(--sk-muted);
}

/* Dark theme */
html[data-theme="dark"] .sks-review-card {
  background: linear-gradient(145deg, #171F24, #242A2D) !important;
  border-color: rgba(183, 146, 85, 0.14) !important;
}

/* ============================================================
   EMPTY STATE
   ============================================================ */
.sks-faq-empty {
  color: var(--sk-muted);
  font-size: 0.9rem;
  padding: 20px 0;
}

/* ============================================================
   RESPONSIVE
   ============================================================ */
@media (max-width: 1024px) {
  .sks-reviews-track { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 700px) {
  .sks-reviews-track { grid-template-columns: repeat(1, minmax(0, 1fr)); }
}