/* Testimonial slider — style 1 (front/partials/testimonial/testimonial-1.blade.php): hover effects (29 Sep 2026).
   The card under the pointer zooms in with a soft shadow and a crimson outline, its quote mark turns crimson and tilts,
   the avatar gets a crimson ring, and the other cards fade back. Plain file (no Vite build in this copy); theme tokens.
   ".tst1[data-slider]" beats cms.css "[data-slider] .swiper" (loaded after this file). */

/* room around the cards so the zoom and shadow are not clipped by the slider */
.tst1[data-slider] .swiper { padding-inline: 0.9rem; margin-inline: -0.9rem; padding-top: 0.9rem; margin-top: -0.9rem; }

.tst1 .testimonial {
  transition: transform 450ms var(--ease-out), box-shadow 450ms var(--ease-out), border-color 450ms var(--ease-out), opacity 450ms var(--ease-out);
}
.tst1 .testimonial__quote-mark { transition: color 450ms var(--ease-out), transform 600ms var(--ease-out); }
.tst1 .avatar { transition: box-shadow 450ms var(--ease-out); }

@media (hover: hover) and (pointer: fine) {
  .tst1 .testimonial:hover {
    transform: scale(1.03);
    box-shadow: var(--shadow-lg);
    border-color: var(--color-primary);
  }
  .tst1 .testimonial:hover .testimonial__quote-mark { color: var(--color-primary); transform: rotate(-10deg) scale(1.15); }
  .tst1 .testimonial:hover .avatar { box-shadow: 0 0 0 3px var(--n-0), 0 0 0 5px var(--color-primary); }
  .tst1 .swiper-wrapper:hover .testimonial:not(:hover) { opacity: 0.6; }
}

@media (prefers-reduced-motion: reduce) {
  .tst1 .testimonial, .tst1 .testimonial__quote-mark, .tst1 .avatar { transition: none; }
  .tst1 .testimonial:hover, .tst1 .testimonial:hover .testimonial__quote-mark { transform: none; }
}