/* ==================================================================
   SECTION: TESTIMONIALS  (.ais-testimonials) — DARK
   Scoped, design-tokens only (no raw hex). Reuses shared components:
   .ais-card (theme.css), .ais-avatar (theme.css), .ais-stars /
   .ais-star--filled (animations.css). This file adds only the
   testimonial-specific layout, the prominent disclaimer callout, and
   hover/reveal polish.
   ================================================================== */

.ais-testimonials {
  position: relative;
  overflow: hidden;
}

/* Soft brand glow anchored top-center, behind the content.
   Layered low-intensity radials + blur so it dissolves into the background
   instead of showing a hard oval edge. Stops derive from --ais-glow so the
   glow still tracks the Glow Intensity setting (reduced % replaces opacity). */
.ais-testimonials::before {
  content: "";
  position: absolute;
  top: -18%;
  left: 50%;
  width: min(900px, 96%);
  height: 460px;
  transform: translateX(-50%);
  background:
    radial-gradient(46% 46% at 50% 42%, color-mix(in srgb, var(--ais-glow) 46%, transparent) 0%, transparent 70%),
    radial-gradient(74% 74% at 50% 46%, color-mix(in srgb, var(--ais-glow) 20%, transparent) 0%, transparent 84%);
  filter: blur(26px);
  pointer-events: none;
  z-index: 0;
}

.ais-testimonials > .ais-container {
  position: relative;
  z-index: 1;
}

/* ------------------------------------------------------------------ */
/* Disclaimer — shown prominently (this is a placeholder section)     */
/* ------------------------------------------------------------------ */
.ais-testimonials__disclaimer {
  display: inline-flex;
  align-items: center;
  gap: var(--ais-space-3);
  margin: var(--ais-space-5) auto 0;
  max-width: 760px;
  padding: var(--ais-space-3) var(--ais-space-5);
  text-align: start;
  font-size: var(--ais-fs-sm);
  line-height: var(--ais-leading-tight);
  color: var(--ais-text);
  background: color-mix(in srgb, var(--ais-orange) 12%, transparent);
  border: 1px solid color-mix(in srgb, var(--ais-orange) 40%, transparent);
  border-radius: var(--ais-radius-pill);
  box-shadow: 0 12px 34px -18px var(--ais-glow);
}

.ais-testimonials__disclaimer-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: none;
  width: 34px;
  height: 34px;
  border-radius: var(--ais-radius-pill);
  color: var(--ais-on-primary);
  background: var(--ais-orange);
  box-shadow: 0 0 0 5px var(--ais-glow);
}
.ais-testimonials__disclaimer-icon .ais-icon { width: 17px; height: 17px; }

.ais-testimonials__disclaimer-text { font-weight: 500; }

/* ------------------------------------------------------------------ */
/* Grid                                                                */
/* ------------------------------------------------------------------ */
.ais-testimonials__grid {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 280px), 1fr));
  gap: var(--ais-grid-gap);
}

/* ------------------------------------------------------------------ */
/* Card                                                                */
/* ------------------------------------------------------------------ */
.ais-testimonial {
  display: flex;
  flex-direction: column;
  gap: var(--ais-space-4);
  overflow: hidden;
}

/* Top accent line that grows in on hover. */
.ais-testimonial::before {
  content: "";
  position: absolute;
  inset: 0 auto auto 0;
  width: 100%;
  height: 3px;
  transform: scaleX(0);
  transform-origin: left center;
  background: linear-gradient(90deg, var(--ais-orange), transparent);
  transition: transform .5s var(--ais-ease);
}
body.ais-hover-lift .ais-testimonial:hover::before { transform: scaleX(1); }

/* Decorative quote mark. */
.ais-testimonial__mark {
  display: inline-flex;
  color: var(--ais-orange);
  opacity: .9;
}
.ais-testimonial__mark .ais-icon {
  width: 38px;
  height: 38px;
  filter: drop-shadow(0 6px 18px var(--ais-glow));
  transition: transform .4s var(--ais-ease);
}
body.ais-hover-lift .ais-testimonial:hover .ais-testimonial__mark .ais-icon {
  transform: rotate(-6deg) scale(1.06);
}

.ais-stars {
  display: inline-flex;
  align-items: center;
  gap: 3px;
  color: var(--ais-text-muted);
}
.ais-stars .ais-icon {
  flex: 0 0 auto;
  width: 18px;
  height: 18px;
}
.ais-star--filled {
  color: var(--ais-orange);
  fill: var(--ais-orange);
}
.ais-testimonial .ais-stars {
  margin-top: calc(var(--ais-space-1) * -1);
}

.ais-testimonial__quote {
  margin: 0;
  flex: 1 1 auto;
  font-size: var(--ais-fs-body);
  line-height: var(--ais-leading-body);
  color: var(--ais-text);
  font-style: normal;
}

/* Person row */
.ais-testimonial__person {
  display: flex;
  align-items: center;
  gap: var(--ais-space-4);
  margin-top: 2px;
  padding-top: var(--ais-space-4);
  border-top: 1px solid var(--ais-border);
}

.ais-testimonial__avatar { width: 50px; height: 50px; }

.ais-testimonial__id {
  display: flex;
  flex-direction: column;
  gap: 2px;
  min-width: 0;
}
.ais-testimonial__author {
  font-family: var(--ais-heading-font);
  font-weight: 700;
  color: var(--ais-text);
  line-height: var(--ais-leading-heading);
}
.ais-testimonial__role {
  font-size: var(--ais-fs-sm);
  letter-spacing: .01em;
  color: var(--ais-text-muted);
}

/* ------------------------------------------------------------------ */
/* Responsive                                                          */
/* ------------------------------------------------------------------ */
@media (max-width: 640px) {
  .ais-testimonials__disclaimer {
    border-radius: var(--ais-radius-lg);
    align-items: flex-start;
    padding: var(--ais-space-4);
  }
  .ais-testimonial__mark .ais-icon { width: 32px; height: 32px; }
}

/* <figure> wrapper for valid quote+attribution semantics (PLAN-3 A4);
   reproduces the li's former direct-children flex behaviour. */
.ais-testimonial__figure {
  display: flex;
  flex-direction: column;
  gap: var(--ais-space-4);
  flex: 1 1 auto;
  margin: 0;
  min-width: 0;
}

/* ------------------------------------------------------------------ */
/* RTL — flip the directional hover accent line (LTR untouched).       */
/* ------------------------------------------------------------------ */
[dir="rtl"] .ais-testimonial::before {
  transform-origin: right center;
  background: linear-gradient(270deg, var(--ais-orange), transparent);
}