/* Testimonials page styles – minimal, leveraging base.css */

/* Layout: hero */
.hero-grid { --grid-min: 20rem; grid-template-columns: repeat(auto-fit, minmax(var(--grid-min), 1fr)); gap: var(--space-8); align-items: center; }
.hero-copy .lead { margin-top: var(--space-4); }
.hero-figure figcaption { margin-top: var(--space-2); }

/* Carousel */
.testimonial-carousel { position: relative; overflow: hidden; }
.testimonial-track { position: relative; min-height: 200px; outline: none; }
.carousel-slide { position: absolute; inset: 0; opacity: 0; visibility: hidden; transition: opacity var(--dur-slow) var(--ease-standard), visibility var(--dur-slow) var(--ease-standard); }
.carousel-slide.is-active { position: relative; opacity: 1; visibility: visible; }
.carousel-slide blockquote { font-size: var(--fs-lg); line-height: var(--lh-relaxed); }
.rating { color: var(--color-primary); letter-spacing: 1px; }
.carousel-header { --grid-min: 18rem; grid-template-columns: repeat(auto-fit, minmax(var(--grid-min), 1fr)); align-items: end; }
.carousel-actions { display: inline-flex; gap: var(--space-3); justify-content: flex-end; }
.carousel-indicators { display: flex; gap: var(--space-3); justify-content: center; margin-top: var(--space-4); }
.dot { width: 10px; height: 10px; border-radius: var(--radius-pill); border: 1px solid var(--color-border); background: var(--gray-200); cursor: pointer; }
.dot.is-active { background: var(--color-primary); border-color: var(--color-primary); }

/* Grid sections */
.success-grid, .reviews-grid, .partners-grid, .quotes-grid, .case-grid, .video-grid { --grid-min: 18rem; grid-template-columns: repeat(auto-fit, minmax(var(--grid-min), 1fr)); gap: var(--space-6); }
.success-figure img { width: 100%; display: block; }

/* Quotes grid */
.quotes-grid .card { font-style: italic; }

/* Video embeds */
.video-wrapper { position: relative; }
.video-embed { width: 100%; aspect-ratio: 16 / 9; border: 0; border-radius: var(--radius-md); box-shadow: var(--shadow-md); }

/* Minor tweaks */
.testimonials-hero { padding-top: clamp(var(--space-12), 4vw, var(--space-20)); }
.card h3 { margin-bottom: var(--space-2); }
.card ul { margin-top: var(--space-2); padding-left: 1rem; }

@media (prefers-reduced-motion: reduce) {
  .carousel-slide { transition: none; }
}
