/* AMJA — carrousel de témoignages vidéo (vertical 9:16, épuré, bouton lecture seul). */
.amjav{
  --amjav-w: clamp(220px, 24vw, 300px);
  --amjav-gap: clamp(12px, 1.6vw, 20px);
  --amjav-cut: 22px;
  position: relative; width: 100%;
}
.amjav-track{
  display: flex; gap: var(--amjav-gap);
  overflow-x: auto; overflow-y: hidden;
  scroll-snap-type: x mandatory; scroll-behavior: smooth;
  overscroll-behavior-x: contain; -webkit-overflow-scrolling: touch;
  scrollbar-width: none; padding: 4px 2px 8px;
  cursor: grab; outline-offset: 6px;
}
.amjav-track::-webkit-scrollbar{ display: none; }
.amjav-track.is-dragging{ cursor: grabbing; scroll-snap-type: none; scroll-behavior: auto; }
.amjav-track.is-dragging .amjav-card{ pointer-events: none; }
.amjav.has-next .amjav-track{ -webkit-mask-image: linear-gradient(90deg, #000 calc(100% - 64px), transparent); mask-image: linear-gradient(90deg, #000 calc(100% - 64px), transparent); }
.amjav.has-prev .amjav-track{ -webkit-mask-image: linear-gradient(90deg, transparent, #000 64px); mask-image: linear-gradient(90deg, transparent, #000 64px); }
.amjav.has-prev.has-next .amjav-track{ -webkit-mask-image: linear-gradient(90deg, transparent, #000 64px, #000 calc(100% - 64px), transparent); mask-image: linear-gradient(90deg, transparent, #000 64px, #000 calc(100% - 64px), transparent); }

.amjav-card{
  position: relative; flex: 0 0 var(--amjav-w); margin: 0;
  aspect-ratio: 9 / 16; scroll-snap-align: start;
  background: var(--amja-deep, #01241E); color: var(--amja-cream, #F8F5F0);
  clip-path: polygon(0 0, 100% 0, 100% calc(100% - var(--amjav-cut)), calc(100% - var(--amjav-cut)) 100%, 0 100%);
  overflow: hidden; isolation: isolate;
}
.amjav-stage, .amjav-poster, .amjav-shield{ position: absolute; inset: 0; }
.amjav-stage{ z-index: 1; background: #000; }
.amjav-stage iframe, .amjav-stage video{ position: absolute; inset: 0; width: 100%; height: 100%; border: 0; object-fit: cover; }
/* Lecteurs horizontaux (YouTube classique, Vimeo 16:9) : recadrés au centre pour remplir le format vertical. */
.amjav-card[data-provider="youtube"] .amjav-stage iframe,
.amjav-card[data-provider="vimeo"] .amjav-stage iframe{ width: 316%; left: -108%; }
.amjav-card[data-provider="youtube"].is-short .amjav-stage iframe{ width: 100%; left: 0; }

.amjav-poster{ z-index: 2; transition: opacity .35s var(--amja-ease, ease); }
.amjav-poster img{ width: 100%; height: 100%; object-fit: cover; display: block; transform: scale(1.001); transition: transform .8s var(--amja-ease, ease); }
.amjav-poster.is-empty{ display: grid; place-items: center; background: radial-gradient(rgba(248,245,240,.12) 1px, transparent 1.3px) 0 0/18px 18px, var(--amja-forest, #024035); }
.amjav-initials{ font-family: var(--amja-display, sans-serif); font-size: clamp(40px, 5vw, 64px); letter-spacing: -.04em; color: var(--amja-lime, #C8F169); }
.amjav-poster::after{ content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(1,36,30,0) 45%, rgba(1,36,30,.88) 100%); }
.amjav-card:hover .amjav-poster img{ transform: scale(1.04); }

.amjav-caption{
  position: absolute; z-index: 4; left: 18px; right: 34px; bottom: 18px;
  display: flex; flex-direction: column; gap: 4px; pointer-events: none;
  transition: opacity .3s var(--amja-ease, ease), transform .3s var(--amja-ease, ease);
}
.amjav-name{ font-family: var(--amja-display, sans-serif); font-weight: 500; font-size: 18px; line-height: 1.2; letter-spacing: -.015em; color: var(--amja-cream, #F8F5F0); }
.amjav-meta{ font-family: var(--amja-sans, sans-serif); font-size: 13px; line-height: 1.35; color: rgba(248,245,240,.78); }

.amjav-play{
  position: absolute; z-index: 5; top: 50%; left: 50%; transform: translate(-50%, -50%);
  width: 68px; height: 68px; padding: 0; border: 0; cursor: pointer;
  display: grid; place-items: center;
  background: var(--amja-lime, #C8F169); color: var(--amja-forest, #024035);
  clip-path: polygon(0 0, 100% 0, 100% 72%, 72% 100%, 0 100%);
  transition: transform .25s var(--amja-ease, ease), background-color .25s, opacity .25s;
}
.amjav-play svg{ width: 30px; height: 30px; fill: currentColor; margin-left: 3px; }
.amjav-play:hover{ transform: translate(-50%, -50%) scale(1.08); }
.amjav-play:focus-visible{ outline: 3px solid var(--amja-amber, #F2A93B); outline-offset: 4px; clip-path: none; }

.amjav-shield{ z-index: 3; display: none; cursor: pointer; background: transparent; }

/* États */
.amjav-card[data-state="loading"] .amjav-shield,
.amjav-card[data-state="playing"] .amjav-shield{ display: block; }
.amjav-card[data-state="loading"] .amjav-play{ pointer-events: none; animation: amjav-pulse 1.1s ease-in-out infinite; }
.amjav-card[data-state="playing"] .amjav-poster,
.amjav-card[data-state="native"] .amjav-poster{ opacity: 0; pointer-events: none; }
.amjav-card[data-state="playing"] .amjav-play,
.amjav-card[data-state="native"] .amjav-play{ opacity: 0; pointer-events: none; }
.amjav-card[data-state="playing"] .amjav-caption,
.amjav-card[data-state="native"] .amjav-caption{ opacity: 0; transform: translateY(8px); }
.amjav-card[data-state="native"] .amjav-stage{ z-index: 6; }
/* Fichier en pause : on garde l'image en cours, assombrie. */
.amjav-card[data-provider="file"][data-state="paused"] .amjav-poster{ opacity: 1; }
.amjav-card[data-provider="file"][data-state="paused"] .amjav-poster img{ opacity: 0; }
.amjav-card[data-provider="file"][data-state="paused"] .amjav-poster.is-empty{ background: rgba(1,36,30,.35); }
.amjav-card[data-provider="file"][data-state="paused"] .amjav-initials{ display: none; }

@keyframes amjav-pulse{ 50%{ transform: translate(-50%, -50%) scale(.9); opacity: .75; } }
@media (prefers-reduced-motion: reduce){
  .amjav-track{ scroll-behavior: auto; }
  .amjav-card[data-state="loading"] .amjav-play{ animation: none; }
  .amjav-poster img, .amjav-play, .amjav-caption{ transition: none; }
}
@media (max-width: 600px){
  .amjav{ --amjav-w: 72vw; }
}