/* ============================================================
   OMNIS — Polaroids apiladas + ciclo "pasar fotos"
   La de delante se levanta y se va al fondo del montón, en loop.
   Solo borde blanco (sin texto, sin espacio abajo).
   Posiciones/transforms los maneja polaroids.js.
   ============================================================ */

body{position:relative}

.polaroids{
  position:absolute;      /* se desplaza con la página al hacer scroll */
  z-index:5;
  transform-origin:0 0;   /* escala desde el punto de anclaje */
  pointer-events:none;
  /* left / top / transform(scale) los calcula polaroids.js: anclado al vídeo
     (object-fit cover) y escalado con él -> mismo sitio y tamaño siempre */
}

.polaroid{
  position:absolute;left:0;top:0;
  width:280px;            /* tamaño fijo de diseño; el contenedor lo escala con el vídeo */
  opacity:0;
  transition:transform .85s cubic-bezier(.5,0,.2,1), opacity .8s ease;
  will-change:transform;
}
.polaroid.shown{opacity:1}

.polaroid .pcard{
  background:#fbfaf4;
  padding:8px;                 /* solo borde blanco uniforme */
  border-radius:2px;
  box-shadow:0 16px 34px -16px rgba(0,0,0,.42), 0 3px 9px rgba(0,0,0,.18);
}
.polaroid img{
  display:block;width:100%;aspect-ratio:1/1;object-fit:cover;background:#1a1a1a;
}

/* slideshow de la polaroid de delante (pim pam) */
.slidebox{position:relative;width:100%;aspect-ratio:1/1;overflow:hidden;background:#1a1a1a}
.slidebox .slide{
  position:absolute;inset:0;width:100%;height:100%;object-fit:cover;
  opacity:0;transition:none;   /* sin transición: corte seco */
}
.slidebox .slide.is-on{opacity:1}

@media(prefers-reduced-motion:reduce){
  .polaroid{transition:opacity .8s ease}
}