/* Passy Média : façades vidéo et murs. Consomme les tokens du thème, avec repli. */
.pm-video { margin: 0; max-width: 100%; }
.pm-video__facade {
  position: relative; display: block; width: 100%; padding: 0; border: 0; cursor: pointer;
  aspect-ratio: 16 / 9; overflow: hidden; background: var(--pa-bg-muted, #eee);
  border-radius: var(--pa-radius, 10px);
}
.pm-video--tiktok .pm-video__facade { aspect-ratio: 9 / 16; max-width: 360px; margin-inline: auto; }
.pm-video__facade img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform var(--pa-dur, 220ms) var(--pa-ease, ease); }
.pm-video__facade:hover img { transform: scale(1.03); }
.pm-video__facade:focus-visible { outline: 3px solid var(--pa-accent, #D8451C); outline-offset: 2px; }
.pm-video__skeleton { position: absolute; inset: 0; background: linear-gradient(90deg, var(--pa-bg-muted, #eee) 25%, var(--pa-line, #ddd) 50%, var(--pa-bg-muted, #eee) 75%); background-size: 200% 100%; animation: pm-shimmer 1.4s infinite; }
@keyframes pm-shimmer { to { background-position: -200% 0; } }
.pm-video__play {
  position: absolute; left: 50%; top: 50%; width: 64px; height: 64px; translate: -50% -50%;
  border-radius: 50%; background: rgb(0 0 0 / .65); backdrop-filter: blur(4px);
}
.pm-video__play::after { content: ""; position: absolute; left: 55%; top: 50%; translate: -50% -50%; border-style: solid; border-width: 12px 0 12px 20px; border-color: transparent transparent transparent #fff; }
.pm-video__brand { position: absolute; left: 10px; top: 10px; padding: 3px 8px; border-radius: 999px; font: 700 11px/1.4 var(--pa-font-text, system-ui); letter-spacing: .04em; color: #fff; }
.pm-video__brand--tiktok { background: var(--pa-tiktok, #010101); box-shadow: 2px 2px 0 var(--pa-tiktok-pink, #EE1D52), -2px -2px 0 var(--pa-tiktok-cyan, #69C9D0); }
.pm-video__brand--youtube { background: #FF0000; }
.pm-video__frame { position: relative; aspect-ratio: 16 / 9; border-radius: var(--pa-radius, 10px); overflow: hidden; background: #000; }
.pm-video--tiktok .pm-video__frame { aspect-ratio: 9 / 16; max-width: 360px; margin-inline: auto; }
.pm-video__frame iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }
.pm-video__caption { display: flex; justify-content: space-between; gap: 1rem; margin-top: .5rem; font-size: var(--pa-text-sm, .875rem); color: var(--pa-ink-2, #555); }
.pm-video__caption a { white-space: nowrap; }

.pm-wall { display: grid; gap: var(--pa-space-4, 1rem); }
.pm-wall__skeleton { display: grid; grid-template-columns: repeat(3, 1fr); gap: .75rem; }
.pm-wall__skeleton span { aspect-ratio: 9 / 16; border-radius: var(--pa-radius, 10px); background: linear-gradient(90deg, var(--pa-bg-muted, #eee) 25%, var(--pa-line, #ddd) 50%, var(--pa-bg-muted, #eee) 75%); background-size: 200% 100%; animation: pm-shimmer 1.4s infinite; }
.pm-wall.is-loaded .pm-wall__skeleton { display: none; }
.pm-wall .tiktok-embed { margin: 0 auto; }
.pm-wall__fallback { margin: 0; }
.pm-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: var(--pa-space-5, 1.25rem); }

.pm-wall__head { display: flex; align-items: center; gap: .75rem; flex-wrap: wrap; }
.pm-wall__title { font-weight: 600; }
.pm-icon { width: 1.25em; height: 1.25em; fill: currentColor; flex: none; }
.pm-wall__brand { width: 1.6em; height: 1.6em; }
